jQuery的.click()事件停止了工作

时间:2014-11-06 09:27:47

标签: javascript jquery tablesorter

我有一个表,其中每行的第一列包含几个图标,每个图标位于一个元素中:

<a title="aaa@aaa.es" class="delete" href="#" data-toggle="modal" data-target="#dialogDeleteUser">
    <img alt="delete" src="/recursos/imagenes/iconPapelera.png">
</a>

我有一个jQuery函数,在单击该链接时应该触发:

$(document).ready(function(){
    $("a.delete").click(function() {
        var userEmail = $(this).attr("title");
        loadUserDelete(userEmail);
    });

事实上它已经工作了一段时间,直到我开始使用Pager小部件和Ajax开始使用TableSorter加载表内容。

表加载得很好,但由于某种原因,该类在该函数中无法识别,我不知道为什么。

6 个答案:

答案 0 :(得分:5)

如果您注册这样的直接事件监听器,则在加载目标内容之前,加载的元素不会被绑定到处理程序。您可以通过使用委托事件来解决此问题,您可以将侦听器绑定到注册事件处理程序时已存在的父元素:

$('#parent').on('click', 'a.delete', function(){
...
}):

参考jQuery's documentation for on()

答案 1 :(得分:5)

在代码挂钩事件运行之后添加的新内容将不会神奇地知道重新运行该代码以在新元素上设置处理程序。您可以改为使用委派处理:

$("selector for the container of these").on("click", "a.delete", function() {
    var userEmail = $(this).attr("title");
    loadUserDelete(userEmail);
});

现在,click被挂钩到所有这些链接所在的容器。如果点击通过a.delete元素进入容器同时冒泡,jQuery将调用你的处理程序。

答案 2 :(得分:2)

在创建对象之前,代码可能会通过您的函数。请尝试将其附加到父级。

$(document).on("click","a.delete",function() {
        var userEmail = $(this).attr("title");
        loadUserDelete(userEmail);
    });

答案 3 :(得分:1)

您应该在父控件上添加click事件,如下所示:

$("#parentControl").on("click", "a.delete", function() {
    var userEmail = $(this).attr("title");
    loadUserDelete(userEmail);
});

答案 4 :(得分:0)

输入错误意外结束。您确定已关闭$(document).ready功能

   $(document).ready(function(){
        $("a.delete").click(function() {
            var userEmail = $(this).attr("title");
            loadUserDelete(userEmail);
        });
    });

答案 5 :(得分:0)

我也面临着同样的情况,但在经历了基础知识后,我意识到了这个&#34;这个&#34;总是在变化。因此,如果你想使用&#34;这个&#34;,首先将它存储在一个变量中然后使用该变量作为选择器,而不是使用&#34;这个&#34;在选择器

var that = $(this);

that.click(function() {
  ...
});