Question

我有一个无序列表

<ul id="showlist"></ul>

如果用户调用ajax函数，则会填充

等列表项

<ul>
    <li>a</li>
    <li>b</li>
    <li>c</li>
    <li>d</li> 
</ul>

我的问题在此之后开始。我的页面上有一个<script>标记。它说当按下向下按钮时，让<ul>蓝色的第一个孩子。但它什么都不做

<script>

$(body).keydown(function(e) {
    if(e.keyCode == 40){
        $("#showlist:first-child").attr("style","background-color:blue");       
    }
})

</script>

我该如何解决我的问题？

Answer 1

使用$('body')代替$(body)。

您的选择器也存在问题：

$("#showlist li:first-child")

工作示例：http://jsfiddle.net/hF6LF/

另外，您在帖子中提到此脚本位于页面末尾。如果您有脚本，则需要等待dom准备好body元素存在。将处理程序绑定到始终存在的document可能更安全。

Answer 2

使用.on jquery方法

$(body).on("keydown", function(e) {
   .....
});

Jquery .on()

Answer 3

Yo必须使用on事件侦听器，它可以处理尚未创建的后代元素上的事件。

请参阅https://api.jquery.com/on/

例如以下内容。

$(document).on( "keydown", "body", function() {
  alert( $( this ).text() );
});

Jquery不适用于通过AJAX调用的HTML标记

3 个答案: