Javascript 我只需要使用JQuery'绑定到我的元素一次；s现场直播

在MVC3中，我有一个视图\u Foo:

我有一个AJAX成功回调，在这里我呈现一个html选项卡。那部分有效

因为表是在ajax.success中创建的，所以我必须使用

live

来监听表行上的事件

我是这样做的：

$("#FooTable tbody tr").live('click', 
                        function(evt) { checkOrUnCheckCheckbox(evt, $(this)); });

checkOrUnCheckCheckbox

回调在所选行的最后一列中设置复选框

问题是：但是当下次加载对话框时，

live

会绑定到表中。现在我有两次相同的绑定，每次都设置和取消设置复选框。同样，如果我再次打开对话框，它的调用三次，它的“工作”，但我仍然不希望函数

checkOrUnCheckCheckbox

被多次调用

解决办法是，先问它是否绑定，然后再不使用live或什么绑定

编辑：共享更多代码，以便更好地理解

// document.ready and the binding
$(document).ready(function () {
    initializeDefaults();
    // use live to bind table, because the table is created in a ajax callback.
    $("#ModtagereTable tbody tr").live('click', 
        function(evt) { checkMedtag(evt, $(this)); });
    });
});

// init. Load of tabel
function initializeDefaults() {
   loadModtagerGruppe();
};

//ajax call to get the list and populate the table with it in the ajax callback           
function loadModtagerGruppe() {
    $.ajax({
        url: '/Foo/GetModtagerListe/',
        contentType: 'application/json; charset=utf-8',
        type: 'GET',
        dataType: 'json',
        })
        .success(function (result) {
            if (result && result.error) {
                //Display error message
                return;
            }

            if (result != null) {
                var tbody = "";
                for (var i = 0; i < result.length; i++) {
                    var item = result[i];

                    tbody = tbody + '<tr class="modtagerRow"><td>' + 
                                      item.FirmaNavn + '</td>' +
                                '<td>' + item.Telefon + '</td>';

                    // Checkbox
                    tbody = tbody + '<td><input type="checkbox"></td>' 
                    + '</tr>';

                }
                $('#ModtagereTable tbody').html(tbody);

            }
        })
        .error(function (xhr, status) {
            //Remove spinner
            $('#ModtagereTable tbody').html("");
        });
    }
}

//document.ready和绑定
$（文档）.ready（函数（）{
初始化故障（）；
//使用live绑定表，因为表是在ajax回调中创建的。
$（“#可改装车身tr”）.live（'点击'，
函数（evt）{checkMedtag（evt，$（this））；}）；
});
});
//初始化。塔贝尔负荷
函数initializedDefaults（）{
loadModtagerGruppe（）；
};
//ajax调用以获取列表并在ajax回调中使用它填充表
函数loadModtagerGruppe（）{
$.ajax({
url:“/Foo/getModTagerList/”，
contentType:'application/json；charset=utf-8'，
键入：“GET”，
数据类型：“json”，
})
.成功（功能（结果）{
if（result&&result.error）{
//显示错误消息
返回；
}
如果（结果！=null）{
var tbody=“”；
对于（变量i=0；i

不要使用

live

它已被弃用。在上使用委托事件处理程序，如下所示：

$('#FooTable').on('click', 'tr', checkOrUnCheckCheckbox);

function checkOrUnCheckCheckbox(event) {
    var el = this;
    // your check/uncheck logic...
}

---

请注意，您将需要将jQuery升级到至少1.7版，但您应该至少使用此版本，不要使用

live

，因为它已被弃用。在上使用委托事件处理程序，如下所示：

$('#FooTable').on('click', 'tr', checkOrUnCheckCheckbox);

function checkOrUnCheckCheckbox(event) {
    var el = this;
    // your check/uncheck logic...
}

请注意，您将需要将jQuery升级到至少1.7版，但您至少应该使用此版本，因为

live（）

已被弃用和删除，您应该使用

on（）

，并且只绑定一次，

one（）

将

文档

替换为最近的非动态父文档

听起来你应该在（）上使用

on

但是，在ajax函数的任何回调之外进行绑定，这样只进行一次，它将应用于以后插入的任何元素。

live（）

已被弃用和删除，您应该使用

on（）

，并且只绑定一次，

one（）

将

文档

替换为最近的非动态父文档

听起来你应该在（）上使用

on

---

但是，在ajax函数的任何回调之外进行绑定，以便只进行一次，它将应用于以后插入的任何元素。

如果您没有新版本的jQuery，并且希望继续使用live（）

---

如果您没有新版本的jQuery，并且希望继续使用live（）

---

哪一个是jquery版本的usedLooks，您根本不需要使用live（），因为很明显，一旦创建元素，您就会绑定事件，因此，只需将

live

替换为

bind

（或

on

）。若您委派事件，不要在对话框的“onload”事件中绑定它。我已经尝试了多次每个解决方案，它们听起来都不错，但对我来说仍然不起作用。也许我错过了什么。我想我必须复制一个正在运行的示例并打开一个新的问题。这是使用的jquery版本吗？就像你根本不需要使用live（）一样，因为很明显，一旦创建元素，你就要绑定事件，所以，只需将

live

替换为

bind

（或

on

）。若您委派事件，不要在对话框的“onload”事件中绑定它。我已经尝试了多次每个解决方案，它们听起来都不错，但对我来说仍然不起作用。也许我错过了什么。我想我必须复制一个正在运行的示例并打开一个新的问题。不要认为

one

是解决方案，因为如果在同一个时间点两次tr会怎么样dialog@ArunPJohny-我也不认为one（）是解决方案，只是在标题中添加了“bind once”，但我猜真正的问题是在一个多次执行的回调函数中放置一个委托事件处理程序。。。如果脚本作为动态html的一部分加载（如

load（）

请求中），则只有一个问题。。。否则OP需要将脚本注册码移动到dom就绪状态handler@adeneo现在可以了。我在上将其更改为

，并将绑定从document.ready移动到ajax回调。但是，你说我应该把它移到ajax绑定之外，但我移到了里面。我相信你，所以现在我很困惑，你能帮我更多吗？是的，这是委托给文档的，所以它不应该在ajax回调中，把它放在外部，它也应该工作得很好，文档总是可用的，所以它不必真的在docu中
$(document).on('click', "#FooTable tbody tr", function(evt) { 
     checkOrUnCheckCheckbox(evt, $(this)); 
});

function handler() {
    checkOrUnCheckCheckbox(evt, $(this));
}
$("#FooTable tbody tr").die('click', handler).live('click', handler);