Question

我正在尝试编写一些使用jQuery在某些click元素上触发<li>处理程序的代码，但它无效。谁能明白为什么？

<li id="savedQueriesSection" class="savedQrs selected">
<a href="#">My Query 1</a></li>

$(document).ready(function () {
 $('.savedQrs').click(function () {
        alert("test");
    });
});

我动态生成像这样的

$.ajax({
        type: "GET",
        url: "/Base/GetQueries",
        success: function (response) {
            $.each(response, function (i, item) {
                $(".tree").append('<li id=savedQueriesSection  class=savedQrs><a            href=#>' + item.QueryName + '</a></li>');
            });
        },
        error: function (result) {
        }
    });

Answer 1

您应该在问题中提到您动态生成这些li 。尝试使用 .on() 事件处理程序附件执行此事件。

$(document).ready(function () {
 $(document).on('click', '.savedQrs', function () {
        alert("test");
    });
});

Answer 2

如果在页面上动态加载内容，则使用jquery的.on（）事件。

on() jquery

可以使用id

完成此操作

 $(document).ready(function () {
  $(document).on('click','#savedQueriesSection',function () {
        alert("test");
    });
  });

也可以使用'class`

来完成

 $(document).ready(function () {
   $(document).on('click', '.savedQrs', function () {
         alert("test");
    });  
 });

单击处理程序不会触发动态插入的元素

2 个答案: