Question

可能重复：
JQuery function doesn't work on Chrome on Mac, but works on Chrome on Win 7 and all other browsers

我有一个选择 - 选项列表

<div class="social-option">
    <select name="hex_theme_options[social-service-1]">
        <option selected="selected" value="facebook">facebook</option>
        <option value="0"></option>
        <option value="twitter">twitter</option>
        <option value="linkedin">linkedin</option>
        <option value="e-mail">e-mail</option>
        <option value="phone">phone</option>
        <option value="instagram">instagram</option>
        <option value="flickr">flickr</option>
        <option value="dribbble">dribbble</option>
        <option value="skype">skype</option>
        <option value="picasa">picasa</option>
        <option value="google-plus">google-plus</option>
        <option value="forrst">forrst</option>
    </select>
</div>

为什么这适用于PC但不适用于mac？

$('.social-option select').on('click', function () {
    alert('bla');
});

http://jsfiddle.net/4BBcZ/

更新
我需要使用点击事件，而不是更改。

Answer 1

改为使用change事件：

$('.social-option select').on('change', function () {
    alert('bla');
});

来自the documentation：

更改事件在其值更改时发送到元素。这个事件仅限于元素，盒子和元素。对于选择框，复选框和单选按钮，事件当用户使用鼠标进行选择时立即触发，但对于其他元素类型，事件将延迟到元素失去焦点。

IIRC，click事件适用于Firefox中的<option>，但在Chrome中不起作用。最受支持的最佳活动是change。

要获取所选选项的值，只需使用.val()，就像使用任何其他输入一样：

$('.social-option select').on('change', function () {
    alert($(this).val());
});

Answer 2

使用“更改”，而不是“点击”事件，如

 $(".social-option select").change(function(){
       alert('bla');

    });`

stackoverflow reference

为什么mac chrome上的选择框不响应click事件？

2 个答案: