5

我有这个dropdown，我想在它的值改变时提醒/记录一些东西。当我dropdown用鼠标单击并选择任何其他值时，会触发更改事件。但是，当焦点在 中时dropdown，我按下up和down箭头，它会更改下拉列表中的值，但不会触发事件，并且现在会显示警报。这是代码

<select id="drpDay" name="drpDay" style="background-color: white;">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7" selected="selected">7</option>    
    </select>
</br>
<select id="drpMonth" name="drpMonth" style="background-color: white;">
        <option value="Jan">Jan</option>
        <option value="Feb">Feb</option>
        <option value="Mar">Mar</option>
        <option value="Apr">Apr</option>
        <option value="May">May</option>
        <option value="Jun">Jun</option>
        <option value="Jul">Jul</option>
        <option value="Aug">Aug</option>
        <option value="Sep">Sep</option>
        <option value="Oct">Oct</option>
        <option value="Nov" selected="selected">Nov</option>
        <option value="Dec">Dec</option>    
    </select>
</br>
<label id="lbl" text="" width="auto">adsf</label>

js是

$('#drpDay, #drpMonth').change(function(event) {
    alert(event.which);
    $('#lbl').text('change ' + event.which + ' and ' + $(event.target).attr('id'));
});

这是小提琴http://jsfiddle.net/2NBPx/4/

What I want is when the value in select box changes, event by pressing upand/or downarrow, I want that event to be fired. 为什么不触发，如何在键盘更改时触发？

4

4 回答 4

8

将其绑定到 keyup 并更改如下：http: //jsfiddle.net/2NBPx/6/

$('#drpDate, #drpMonth').on('change keyup',function(event) {
    if($(this).data('last') !== $(this).val()){
        $(this).data('last', $(this).val());            
        $('#lbl').text('For change ' + event.which + ' and you ' + $(event.target).attr('id'));
    }
});

UPDATE: 仅在发生实际更改时触发。

于 2012-11-06T07:04:19.193 回答
2

以下将确保无论何时通过键盘或鼠标选择更改，都会触发更改事件。

var prevValue = null;

$('#drpDay').change(function() {
    console.log('changed');
    prevValue = this.value;
});

$('#drpDay').keyup(function() {
    if(prevValue != this.value) {
        $(this).trigger('change');
    }
});

检查这个演示：http: //jsfiddle.net/ZCxe8/

于 2012-11-06T07:21:41.263 回答
1

你使用的是什么浏览器 ？

在我的 Chrome 和 IE9 中，您提供的小提琴可以在键盘上正常使用。

于 2012-11-06T07:21:01.960 回答
0

您可以结合changeandkeyup事件。如果您的事件处理程序只应在值实际更改时才执行他的工作，那么您将不得不在其中添加更多逻辑（记住旧值，比较，行动，...）

$('#drpDay, #drpMonth').on("change keyup", function(event) {
    //...
});
于 2012-11-06T07:04:42.847 回答