16

我在 HTML 表单上有一个简单的列表框和这个非常基本的 jQuery 代码

    //Toggle visibility of selected item
    $("#selCategory").change(function() {
        $(".prashQs").addClass("hide");
        var cat = $("#selCategory :selected").attr("id");
        cat = cat.substr(1);
        $("#d" + cat).removeClass("hide");
    });

当使用鼠标选择当前项目时，更改事件会很好地触发，但是当我使用键盘滚动项目时，不会触发事件并且我的代码永远不会执行。

这种行为有原因吗？解决方法是什么？

4

5 回答 5

21

onchange在元素失去焦点之前，通常不会触发该事件。您还需要使用onkeypress. 也许是这样的：

var changeHandler = function() {
    $(".prashQs").addClass("hide");
    var cat = $("#selCategory :selected").attr("id");
    cat = cat.substr(1);
    $("#d" + cat).removeClass("hide");
}

$("#selCategory").change(changeHandler).keypress(changeHandler);

您将需要两者onchange并onkeypress分别考虑鼠标和键盘交互。

于 2009-08-06T06:16:47.903 回答
4

有时，每个浏览器的更改行为可能会有所不同，作为一种解决方法，您可以执行以下操作：

 //Toggle visibility of selected item
    $("#selCategory").change(function() {
        $(".prashQs").addClass("hide");
        var cat = $("#selCategory :selected").attr("id");
        cat = cat.substr(1);
        $("#d" + cat).removeClass("hide");
    }).keypress(function() { $(this).change(); });

您可以链接任何您想要的事件并手动触发更改事件。

IE：

var changeMethod = function() { $(this).change(); };
....keypress(changeMethod).click(changeMethod).xxx(changeMethod);
于 2009-08-06T05:53:41.693 回答
1

您所描述的行为，即在选择元素中通过键盘滚动触发的更改事件，实际上是 Internet Explorer 错误。DOM Level 2 Event规范将事件定义change为：

当控件失去输入焦点并且其值在获得焦点后已被修改时，会发生更改事件。此事件对 INPUT、SELECT 和 TEXTAREA 有效。元素。

如果您真的想要这种行为，我认为您应该查看键盘事件。

$("#selCategory").keypress(function (e) { 
  var keyCode = e.keyCode || e.which; 
  if (keyCode == 38 || keyCode == 40) { // if up or down key is pressed
     $(this).change(); // trigger the change event
  } 
});

在此处查看示例...

于 2009-08-06T06:09:01.633 回答
0

我在 JQuery 1.4.1 下遇到了 IE 的这个问题 - 如果使用键盘进行更改，组合框上的更改事件不会触发。

似乎已在 JQuery 1.4.2 中修复。

于 2010-07-15T00:35:26.497 回答
0 
$('#item').live('change keypress', function() { /* code */ });
于 2012-06-07T21:52:13.233 回答