Question

$("#question-proper table tr td input[value='Save']").on('click',function(){
        var number = parseInt($(this).attr('data'));
        $(this).attr("value","Add");
        alert("Clicked");
});

当我再次点击输入按钮时，其值为Add。它再次警告不是预期的。它不应该因为输入按钮的现在值是“添加”而不是“保存”。

Answer 1

$(document).on("click", "input[value='Save']", function(){
    $(this).attr("value", "Add");
    alert("clicked");
});

根据您的需求进行调整

在这里小提琴：http://jsfiddle.net/omofa2v9/

了解事件委托here

Answer 2

事件绑定到元素，即使它不再与查询匹配也会保留。事实上，该事件甚至不知道查询是什么，只知道它被添加到的实际元素。

可能的解决方案：

委托父元素：

$("#question-proper table tr td").on('click', "input[value='Save']", function(){        
    var number = parseInt($(this).attr('data'));
    $(this).attr("value","Add");
    alert("Clicked");
});

检查事件：

$("#question-proper table tr td input[value='Save']").on('click',function(){
    if($this).attr('value') !== 'Save') return;

    var number = parseInt($(this).attr('data'));
    $(this).attr("value","Add");
    alert("Clicked");
});

使用.one：

仅运行一次活动

$("#question-proper table tr td input[value='Save']").one('click',function(){
    var number = parseInt($(this).attr('data'));
    $(this).attr("value","Add");
    alert("Clicked");
});

jquery选择器总是选择它不应该

2 个答案: