gpt4 book ai didi

javascript - 如何触发jquery点击事件动态生成列表

转载 作者:行者123 更新时间:2023-12-03 05:13:59 25 4
gpt4 key购买 nike

嗨,我正在尝试使用 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/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com