Question

我一开始就有一个空列表。

<ul id="list" data-role="listview" data-inset="true">
            </ul>

在文档就绪功能中，我调用了多个

$('#list').append('<li id="a">A</li>').listview('refresh');

到每个都有自己唯一ID的ul。所以结果应该是：

 <ul id="list" data-role="listview" data-inset="true">
      <li id="a">A</li>
      <li id="b">B</li>
 </ul>

但是在HTML中的body标签的末尾，我尝试做类似

的事情

 $('#list').children()

它出现为空集[]。同样，当我附加像$("#a").click(function{alert("A")})这样的点击事件时，它根本不起作用，因为它不能识别#a，因为它可能是动态创建的吗？

我希望有人可以帮我解决最新情况，如果有办法解决这个问题。

Answer 1

你需要使用jquery live函数将事件绑定到动态添加的数据。试试这个。

$("#a").live('click',function(){
alert("A");
});

Answer 2

不知道.children的事情。听起来很奇怪。

点击事件是因为项目是动态创建的，是的。

为了解决这个问题，请为每个项添加一个类。

<li id="a" class="ListItem">A</li>

然后你可以使用每个关键字在列表中进行迭代。

对于点击事件，请使用live关键字。

$(".ListItem").live("click", function() { your code here })

Answer 3

使用jQuery mobile时，您不能像通常那样使用文档就绪处理程序。由于页面是使用ajax引入的，因此文档就绪处理程序仅被触发一次（无论用户首先登陆哪个页面）。您应该绑定到pagecreate（events）事件。

此外，与其他人提到的一样，您需要使用live来处理动态添加内容的点击事件。

Answer 4

你可以这样做：

<script type="text/javascript" src="jquery-1.6.3.min.js"></script>
<script>
$(document).ready(function(){
    $('#list').append('<li id="a">A</li>')
    .append('<li id="b">B</li>')
    .append('<li id="c">C</li>'); 
});
</script>
<ul id="list" data-role="listview" data-inset="true"></ul>
<script>
setTimeout(function(){
    $('#list').children("li").each(function(){
        alert($(this).attr("id"));
    });
},100);
</script>

setTimeout使它工作的原因

追加jquery手机后得到孩子？

4 个答案: