尝试选择对象时接收错误并使用js添加单击事件

时间:2013-09-06 22:40:10

标签: javascript jquery firefox

继续收到错误

 "--
[18:37:08.353] Use of Mutation Events is deprecated. Use MutationObserver instead. @ chrome://firebug/content/chrome/tabContext.js:589"

"[18:37:10.710] TypeError: myNode is null @ http://site.com/image:89"

我使用Ruby on Rails,webBrick和FireFox ..

设置此项以查看我是否可以在控制台中显示任何内容以显示...上面收到错误..

<script>

(function() {
    var myNode = document.querySelector('#img-list ul.grid');

    myNode.addEventListener("click", function(e) { 
        console.log(e);
    }, false);

})();

</script>

<style>

li {
    display:inline-block;
    width:150px;
    height:auto;
    padding: 10px 10px 10px 10px;   
}

#img-list {
    width:330px;
}

</style>


<div id="img-list">
    <ul class="grid">
        <li><img src="assets/1/1_1.png"></li>
        <li><img src="assets/1/1_2.png"></li>
        <li><img src="assets/1/1_3.png"></li>
        <li><img src="assets/1/1_4.png"></li>
    </ul>
</div>

1 个答案:

答案 0 :(得分:1)

当浏览器看到<script>时,#img-list会在document.querySelector('#img-list ul.grid')位于DOM之前执行,因此$(function() { $('#img-list ul.grid').click(function(e) { console.log(e); }); }); 找不到任何内容。

由于您的问题标有,为什么不使用它?

{{1}}

这将延迟运行JavaScript,直到DOM准备就绪。