2

我看到了非常奇怪的行为 - 在 Firefox 中,如果您有一个未选择任何项目的选择下拉菜单,则 onchange 事件会触发 onblur - 即使您只是将焦点更改为页面上的不同元素。我的选择只是一个普通的选择:

<select id="mySelect">
        <option value="Value0">Value 0</option>
        <option value="Value1">Value 1</option>
        <option value="Value2">Value 2</option>
</select>

我的js是:

$("#mySelect").change(function(){
    alert('Change event fired'); 
});

$("#mySelect").attr('selectedIndex', '-1');

看到这个jsfiddle:http: //jsfiddle.net/W8QR4/

如果我实际上没有单击新选项(除了升级到更新版本的 jquery。我知道,我现在坚持使用它),有什么方法可以防止 onchange 触发?

change 事件在它应该被触发时被触发。我知道代码本身确实有效。

复制步骤:

  1. 单击选择的小向下箭头
  2. 将鼠标悬停在值 1 或值 2 上,但不要选择它
  3. 单击另一个输入 - 两次,因此焦点从选择中移除并传递给另一个元素

这仅在下拉列表中选择任何项目之前有效。一旦做出选择,这不会发生

4

1 回答 1

0

这是我想出的答案,请随时评论/改进:

$("#mySelect").attr('selectedIndex', '-1');

//Capture the initial selection of each dropdown
$('select').each(function() {
    $(this).data('initialSelection', String($(this).attr('selectedIndex')));
});

//Add click event to all options. When clicked, change initial selection and unbind the click event
$('select option').click(function() {
    $(this).parent().data('initialSelection', '').attr('selectedIndex', this.index).find('option').unbind('click');
});

//Onchange, check if initial selection is still -1. (If there is a click it will be reset to '') 
//Otherwise, it was just a hover - reset selected index to -1
$('select').change(function(e){
    if($(this).data('initialSelection') == '-1'){
         $(this).attr('selectedIndex', '-1');
    }
});
于 2013-07-02T11:59:22.733 回答