0

我有一个绑定到选择标签的更改事件。选择标签中的第一个选项被禁用,因为我将它用作菜单的默认文本。如果用户单击选择标签,将鼠标悬停在选项上而不选择它,然后在选择菜单之外单击两次,则将触发更改事件。如何防止触发此更改事件。

的HTML

<select id="select">
    <option disabled="disabled" selected="selected">Title</option>
    <optgroup label="things">
        <option>cars</option>
        <option>boats</option>
        <option>world</option>
    </optgroup>
</select>

jQuery

$('#hide').click(function(){
    $('#select').hide();
});
$('#show').click(function(){
    $('#select').show();
});
$('#select').change(function(){
    alert($(this).val());
});

该代码只是我的问题的一个示例。我添加了按钮,因为在我的真实代码中,当用户在选择菜单之外单击时,我隐藏了选择菜单。

这是上面代码的小提琴

编辑

在查看评论后,它看起来是一个特定于 Firefox 的问题,因为它在 Internet Explorer、Chorme 和 Safari 中运行良好。

4

1 回答 1

1

您始终可以将 select 上的一些数据与当前值相关联,并验证它是否实际发生了变化。

$('#hide').click(function(){
    $('#select').hide();
});
$('#show').click(function(){
    $('#select').show();
});
$('#select').data('currVal', 'Title');
$('#select').change(function(){
    if($(this).val() != $(this).data('currVal') {
        // this is actual value change
        alert($(this).val());
        $(this).data('currVal', $(this).val());
    }
});

我已经用解决方案更新了原始小提琴:

http://jsfiddle.net/TPpD6/4/

于 2012-12-14T23:35:11.700 回答