Question

我有一个选择下拉框的工作jsFiddle，但它不是我需要的结果。在这个例子中，我使用了奥克兰的港口＆＃39;。如果您点击奥克兰港口＆＃39;它会显示它的内容，但我希望更改下拉框值，使其与您正在查看的端口相匹配。

UPDATE 解决方案是使用prop功能。此外，而不是复制所有端口......有没有更简单的方法来缩小jQuery为所有人工作？然后，我不必显示/隐藏大量元素。

$(document).ready(function(){
    $("select").change(function(){
        $( "select option:selected").each(function(){
            if($(this).attr("value")=="all"){
                $(".auckland").hide();
                $(".all").show();   
            }
           if($(this).attr("value")=="auckland"){
                $(".all").hide();
                $(".auckland").show();

            }
        });
    }).change();

    $('.auckland-link').click(function() {
    $('.auckland').show();
    $(".all").hide();
});


});

任何帮助将不胜感激。欢呼声。

Answer 1

您可以使用jQuery .prop（）方法更改它。

$(document).ready(function(){
    $("select").change(function(){
        $( "select option:selected").each(function(){
            if($(this).attr("value")=="all"){
                $(".auckland").hide();
                $(".all").show();



            }
           if($(this).attr("value")=="auckland"){
                $(".all").hide();
                $(".auckland").show();

            }
        });
    }).change();

    $('.auckland-link').click(function() {
        $('select option:contains("Auckland")').prop('selected', true);
        $('.auckland').show();
        $(".all").hide();
});


});

这是一个工作样本，从您的小提琴分叉： http://jsfiddle.net/Lny58ve3/2/

jQuery选择框交互

1 个答案: