Question

在以下example中，有一个简单的输入字段和一个按钮。

    <body>
    <input type="text" id="in">
    <input type="button" value="click" id="button">
    </body>

输入字段上有一个change-event-function，按钮上有一个click-event-function。

    $(document).ready(function() {
      $('#in').change(function() { 
        console.log('change event');
        //window.alert('change event');
      });
      $('#button').click(function() { 
        console.log('click event'); 
      });
    });

在更改输入字段的值并立即单击按钮（不离开光标）时，我的期望是两个事件都被触发。不幸的是，这种行为取决于在变更函数内执行的代码，例如在取消注释window.alert行时，不会触发click事件 - 或者不执行click-event-function。为什么？如何避免代码阻止click事件函数执行？

更新：而不是window.alert，jquery.hide有same effect

    $(document).ready(function() {
      $('#in').change(function() { 
        console.log('change event');
        $('#hide').hide();
      });
      $('#button').click(function() { 
        console.log('click event'); 
      });
    });

Answer 1

如果要同时触发两个事件，可以这样做：

$(document).ready(function() {
      $('#in').change(function() { 
        console.log('change event');
        window.alert('change event');
        $('#button').click();
      });
      $('#button').click(function() { 
        console.log('click event'); 
      });
    });

Answer 2

尝试

$(document).mousedown(function(e){
    console.log('click event'); 
});

mousedown事件将在文本框更改和单击事件之前发生，因此您需要设置超时并在需要时检查文本框的更改值。

jquery更改有时事件会阻止单击事件

2 个答案: