Question

假设我有一个ID为＆＃34; btn＆＃34;我在按钮上添加一个事件：

$(document).ready(function() {
    $("#btn").click(function(){
        $("#label1").html((new Date()).getSeconds());
        $("#btn").click(function () {});
    };
})

其中＃label1是一个标签点击，应该显示当前秒。

我希望第一次点击按钮，当前秒将显示在label1中。然后点击此按钮，没有任何反应。但我得到的是每次点击按钮时，标签1中会显示新的当前秒。怎么了？

Answer 1

使用one()绑定事件

$("#btn").one('click', function(){
    $("#label1").html((new Date()).getSeconds());
});

请注意，$("#btn").click(function () {});并未取消绑定事件。它再次绑定该元素上的click事件，因此下次单击该按钮时，将调用一个事件处理程序，以更新html和其他无效的空函数。

要取消绑定事件，可以使用off()，但在这种情况下，one()是首选。

$("#btn").on('click', function () {
    $("#label1").html((new Date()).getSeconds());

    $(this).off('click');
});

Answer 2

您只需使用.one()。

将处理程序附加到元素的事件。每个事件类型的每个元素最多执行一次处理程序。

$(document).ready(function() {
    $("#btn").one('click', function(){
        $("#label1").html((new Date()).getSeconds());
    });
})

目前，您正在使用$("#btn").click(function () {});

绑定另一个点击处理程序

Answer 3

您好，您可以通过以下方式删除Click Listener。

var data=[{"_id":"57b3e7ec9b209674f1459f36","fName":"Tom","lName":"Moody","email":"Tom@example.com","age":30},{"_id":"57b3e8079b209674f1459f37","fName":"Pat","lName":"Smith","email":"pat@example.com","age":32},{"_id":"57b3e8209b209674f1459f38","fName":"Sam","lName":"Dawn","email":"sam@example.com","age":28},{"_id":"57b3e8219b209674f1459f39","fName":"Sam","lName":"Dawn","email":"sam@example.com","age":28}]

var table=[];
var dataArr = Object.keys(data).map(function(k) { return data[k] });
dataArr.forEach(function(user) {
    var tempArr=[];
    tempArr[0]=user.fName;
    tempArr[1]=user.lName;
    tempArr[2]=user.email;
    tempArr[3]=user.age;
    table.push(tempArr);
 });

 console.log('table'+JSON.stringify(table));

为什么我不能用JQuery .click（）函数更改按钮事件？

3 个答案: