嗨,我正在尝试使用 jquery 动态地用新列表替换已经创建的列表。但在新创建的列表中,我无法使用任何 jquery 事件。
我创建了一个玩家列表
- 萨钦
- 苏拉夫
- 拉胡尔
单击任何列表名称时,它都会提醒其 id,然后使用 jquery 动态替换新创建的列表。
- 科利
- 女士
- 拉哈尼
但我无法为新创建的列表选择点击事件。当我们单击新动态列表的任何名称时,它没有在控制台中显示任何错误,并且没有任何反应。
<html>
<head>
<script src="jquery-3.1.1.js"></script>
<script>
$(document).ready(function(){
$("#videoul li").click(function(){
var vocab_id = $(this).attr('id');
alert("Hi the ID is " + vocab_id);
var aaila = '<a href="#" id="i_am_link">Click me again</a><ul id = "videoul"><li id="Kohli">Virat</li><li id="Dhoni">M S</li><li id="Rahane">Ajinkya</li></ul>';
$('#videowrapper').html(aaila);
});
});
</script>
</head>
<body>
<div id="videowrapper"><a href="#abc" id="i_am_link">Click me</a>
<ul id="videoul">
<li id="Tendulkar">Sachin</li>
<li id="Ganguly">Sourav</li>
<li id="Dravid">Rahul</li>
</ul>
</div>
</body>
</html>
我现在一无所知,如何让它发挥作用。
最佳答案
使用“on”方法。您可以使用非动态创建的其他元素来代替 $("body") 选择器。
$('body').on('click', '#videoul li', function() {
var vocab_id = $(this).attr('id');
alert("Hi the ID is " + vocab_id);
var aaila = '<a href="#" id="i_am_link">Click me again</a><ul id = "videoul"><li id="Kohli">Virat</li><li id="Dhoni">M S</li><li id="Rahane">Ajinkya</li></ul>';
$('#videowrapper').html(aaila);
});
关于javascript - 如何触发jquery点击事件动态生成列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41683547/