Question

有人可以看看这个code，其中每个函数都运行完美但只有点击事件（最后一个代码）

 $('ul#showUsernames li').on('click', function () {
    selectedUsername = $(this).text();
    if (selectedUsername != chatUsername) {
        chatTitleName.text("Chat between " + chatUsername + " and " + selectedUsername);
    }
 });

我在这里使用.click和bind('click',function他们也没有用。

我在这里使用on因为我通过jQuery生成li元素dynamically。

我不确定这是否与我在项目中使用SignalR有关。

请帮忙。

Answer 1

将事件委派与on()

一起使用

$('#showUsernames').on('click', 'li', function () {
   ...

这也适用于动态插入的列表项，并且性能更高（因为您在ul而不是 n 处理程序上附加单个事件处理程序{ {1}}元素。

作为旁注，只需使用li代替$('#showUsernames')，因为它更快（就像直的$('ul#showUsernames')）

Answer 2

使用on()

$('ul#showUsernames').on('click', 'li', function () {

Answer 3

您可以使用Jquery Live

$('li ul#showUsernames').live('click',function () {

也可以使用on as live is depricate（感谢@Mr_Green）

$('ul#showUsernames').on('click', 'li', function () {

Answer 4

使用live()

示例：

$(".button").live("click", function() {
});

请务必同时致电die()：

$(".button").die();

die（）会阻止您的事件多次触发。如果您的内容被多次异步加载而没有同步重新加载整个页面，则会出现这种情况。这是因为旧的处理程序仍然存在于浏览器内存中，并且它们也被解雇了（简单的解释）。

希望它有所帮助。

点击事件的jQuery不适用于动态生成的li

4 个答案: