Question

（使用jQuery 1.4.4版）

问题的标题可能不是那么清楚，这就是为什么我将在下面进行更详细的描述：

当我的一个选择框中的选项发生变化时，我试图触发一些javascript代码。我知道我可以使用change()执行此操作，如下所示：

var my_handler = function(eventObject){
  // ... do something here ...
};
$('#my_select_box').change(my_handler);

问题是，当用户通过键盘更改选择时，不会触发此操作。我搜索了SO，并且每个人都建议在keyup事件上绑定相同的处理程序，如下所示：

var my_handler = function(eventObject){
  // ... do something here ...
};
$('#my_select_box').change(my_handler).keyup(my_handler);

确实，当我通过键盘更改选择时以及当我通过鼠标更改选择时，执行处理程序。

问题是当我用键盘改变选择时，然后我转到表格中的下一个字段（通过鼠标或键盘）。处理程序再次被触发（第二次）

你能解释一下为什么会发生这种情况并告诉我是否有办法绕过这个问题？

Answer 1

唯一可行的答案是以某种方式跟踪值的实际变化，比如事件处理程序之外的变量。您可能无法避免举起活动，但您可以选择不回复。以下示例说明：

var lastVal = null;
var my_handler = function(eventObject) {
    if (lastVal == $(this).val()) return;
    console.log("Changed");
    lastVal = $(this).val();
    eventObject.stopPropagation();
};

$('#my_select_box').change(my_handler).keyup(my_handler);

Answer 2

您可以尝试使用按键事件：http://www.quirksmode.org/dom/events/keys.html

或者您可以忽略您不想要的关键事件：http://unixpapa.com/js/testkey.html

Answer 3

鉴于您的要求，一个不太理想的解决方案将是选择的关键，并根据jsfiddle example点击选项

$("#my_select_box option").bind("click", function(e) {
    my_handler();

});

$("#my_select_box").bind("keyup", function(e) {
    my_handler();

});

如何在更改或关键字上触发选择标记上的某些代码，但不会在选择失去焦点时触发

3 个答案: