Question

我想知道如何在选择框中的所选两个选项上同时显示div个Квартира。如果选择Гараж和<select id="multiple" multiple="multiple"> <option>Гараж</option> <option>Загородный дом</option> <option>Квартира</option> </select> <input type="text" class="input-xlarge required" name="project_title" id="project_title" value="" /> <div class="panel" id="foo123" ><h3 class="pane-toggler title" id="panel_id114"><a href="javascript:void(0);"><span>Квартира</span></a></h3><div class="pane-slider content"><div class="row-fluid" style="padding: 0 15px;"><div class="span12"><div class="test"><div class="span4"><label for="id_category_112" class="checkbox"><input type="checkbox" name="id_category[]" id="id_category_112" value="112" class="jb-checkboxes parent-checkbox" data-id="112">- Стройка</label><ul class="child"><li class="child-113"> <input type="checkbox" data-parent="112" class="ch parent-id-112" data-price="{"first":"1","second":"2","third":"3"}" name="id_category[]" value="113"> <b>- Фундамент</b> <input type="text" name="cat_val[113]" placeholder="м2." data-cat="113" class="type-cat type-113" value=""> </li></ul></div></div> </div></div></div></div> <div class="panel" id="foo1234" ><h3 class="pane-toggler title" id="panel_id114"><a href="javascript:void(0);"><span>Гараж</span></a></h3><div class="pane-slider content"><div class="row-fluid" style="padding: 0 15px;"><div class="span12"><div class="test"><div class="span4"><label for="id_category_112" class="checkbox"><input type="checkbox" name="id_category[]" id="id_category_112" value="112" class="jb-checkboxes parent-checkbox" data-id="112">- Стройка</label><ul class="child"><li class="child-113"> <input type="checkbox" data-parent="112" class="ch parent-id-112" data-price="{"first":"1","second":"2","third":"3"}" name="id_category[]" value="113"> <b>- Фундамент</b> <input type="text" name="cat_val[113]" placeholder="м2." data-cat="113" class="type-cat type-113" value=""> </li></ul></div></div> </div></div></div></div>来显示各自的div，我想显示。

here's code

{{1}}

Answer 1

＆＃34; .val（）＆＃34; method返回以逗号分隔的所选值列表。您可以使用＆＃34;：selected＆＃34; css选择器检查选择了哪些项目并执行所需的操作。

以下是您的代码中已修改为可以工作的片段：

$("#multiple").change(function(){
    $("#foo123").hide();
    $("#foo1234").hide();
    $('#multiple :selected').each(function(i, selected) {
        var val = $(selected).val();
        if(val === 'Квартира') {
            $("#foo123").show();           
        }
        if(val === 'Гараж') {
            $("#foo1234").show();
        }
    });      
});

显示多个选项

1 个答案: