键盘箭头启动更改时,jQuery onchange事件不会触发?

时间:2011-10-20 21:33:07

标签: jquery

每次onchange事件触发select时,我都在使用下面的jQuery更改div元素的字体。

麻烦的是,当我使用键盘循环选择列表选项时,它不起作用。

仅在通过鼠标点击或字母单击更改选择列表时触发。我怎样才能使它也向上,向下,向右,向左响应?

var changeHandler = function() {
    $('.fontPreview').fadeOut();
    var myFont = $('#myFonts :selected').val();
    var myFont2 = $('#myFonts :selected').val().split(':')[0];
    $('#fontPreviewSrc').attr('href','http://fonts.googleapis.com/css?family='+myFont);
    $('.fontPreview').attr('style','font-family:'+myFont2+';font-style:normal;font-size:2em;padding-top:10px;white-space:nowrap');
    $('.fontPreview').fadeIn(1500);
}

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

1 个答案:

答案 0 :(得分:1)

我认为你需要这样的东西:

$(document).ready(function() {
    deflectEvent = function(event) {
        var listItemCount = $("#list1 > option").length - 1;
        var selectedItemIndex = $("#list1")[0].selectedIndex;
        if (event.which == $.ui.keyCode.UP) {
            $("#list1")[0].selectedIndex = (selectedItemIndex - 1 < 0) ? listItemCount : selectedItemIndex - 1;
        }
        if (event.which == $.ui.keyCode.DOWN) {
            $("#list1")[0].selectedIndex = (curListItem + 1 > noOfListItems) ? 0 : curListItem + 1;
        }
    }

    $(function($) { $("#input1").bind("keydown", deflectEvent) });
});