jQuery Click功能在Chrome上不起作用

时间:2012-12-30 00:49:55

标签: jquery css click

我想在我的网站上放置菜单的样式切换器,但它不适用于Chrome / IE / Safari(在FireFox上运行良好)。这是一些代码:

    // Menu Style Switcher
    $("#option-1").click(function(){
        $("#navigation").removeClass("style-2");
    });

    $("#option-2").click(function(){
        $("#navigation").addClass("style-2");
    });


<div class="menu-style">
    <select>
        <option id="option-1">Style 1</option>
        <option id="option-2">Style 2</option>
    </select>
</div>

2 个答案:

答案 0 :(得分:4)

addClassName不存在。函数的正确名称是addClass


另一项改进是在选项中使用change元素的select事件而不是click

// Menu Style Switcher
$('.menu-style select').change(function(){
    if (this.value === 'Style 1'){
        $("#navigation").removeClass("style-2");
    } else {
        $("#navigation").addClass("style-2");
    }
});

答案 1 :(得分:0)

您应该在整个<select>元素上收听change事件。

<强>标记

<select id="yourSelect">
    <option value="1">1</option>
    <option value="2">2</option>
</select>

<强> JS

$('#yourSelect').change(function(e){

    if( $(this).val() == 1){

        $("#navigation").removeClass("style-2");        

    }else{

        $("#navigation").addClass("style-2");        

    }
}

See fiddle