javascript - 当 onchange 接管时，如何返回到原始事件？

Question

我有文本输入和按钮输入。

文本框有一个 onchange 事件处理程序，按钮有一个 click 事件处理程序。

单独来看两者都可以正常工作。但是当我更改文本框中的一些文本并单击按钮时，onchange 事件首先触发并阻止点击触发。

如何在 onchange 之后仍然触发点击事件？或者至少弄清楚是什么导致了 onchange 中的事件？

这是 jsfiddle 示例:http://jsfiddle.net/4mQPe/

Answer 1

有趣的问题 - 这可能并不明显，但事件被“阻止”的原因是因为它从未发生过。这是因为更改事件是在您单击字段外部时触发的，即使您单击了按钮(看起来像您单击了按钮)，它也从未发生过(因为警告框阻止了它)。

输入框具有默认值，您可以合法地利用它在输入更改时更新输入的默认值。下面的示例应该可以解决您的问题。

$(function(){
    $('#button').bind("click",function(){       
        if($('#textbox').attr('defaultValue') != $('#textbox').val()) {
            alert("button clicked and value changed");
            $('#textbox').attr('defaultValue', $('#textbox').val());
        } else {
            alert("button clicked and value not changed")
        };
      });
});

或者，如果您仍然需要 change 事件，那就不要有警告框

<input type="text" id="textbox"/><br/>
<input type="button" id="button"/>

<div id='container'></div>



$(function(){
    $('#button').bind("click",function(){
          alert("button click");
      });
$('#textbox').bind("change",function(){
    //alert("text changed");
    $('#container').html("changed!");
});

});