js中获取元素碰到的问题

Question

问题描述：动态创建了一个html结构，为什么window那个事件里的$('login')可以获取到，而下面的$('close')获取不到，就是close那个事件没反应，把这个事件放到btn1的click里才可以执行。

疑问：当我点击btn1的时候，通过浏览器的检查可以看到是已经生成<div id='close'>X</div>了，但为什么$('#close').click()却没有反应，但是window的事件中的#login就可以获取到，这是为什么呀？麻烦各位了！谢谢啦！

Answer 1

有个小小的建议，下次直接贴代码，不要贴截图。这样大家都方便。

记住：如果不是代码控制，浏览器不会将同一行代码执行两次。
当浏览器执行这个语句时，

$('#close').click(function(){
    alert(123);
    });

DOM结构中并不存在`#close'这个元素，所以事件绑定失败。

为什么window那个事件里的$('#login')可以获取到

因为#login是在被创建后才去获取$('#login')的，不然你试试不点击btn1,调整窗口打下触发resize事件，看看$('#login')能不能获取？

而下面的$('close')获取不到

因为当执行$('#close').click(...)时，#close还没有创建，自然是获取不到

把这个事件放到btn1的click里才可以执行

放进btn1的click里可以执行，是因为当执行$('#close').click(...)时，#close已经被创建了。

tips:回调函数是作为参数传递给一个语句的，如果事件没有发生，回调函数肯定不会执行

Answer 2

这个应该涉及到了事件委托。
你把

$("#close").click(function{
    alert(123);
})

改成

$(window).on("click",'#close',function{
    alert(123);
})

试试，如果可以的话，我就不啰嗦了
你在仔细看下这篇文章。
http://yujiangshui.com/javascript-event/