-1

我有以下 HTML，其中包含各种多选框 -

 <p>
 <label>Main Category</label>
 <select id="mainSelect" name="super_category" multiple>
    <option value="CatA">CatA</option>
    <option value="CatB">CatB</option>
 </select>
 </p>
 <p>
 <label>SubCategoryA</label>
 <select class="multiselectbox" name="super_subcategory_CatA" multiple>
     <option value="SubcatA1">SubcatA1</option>
     <option value="SubcatA2">SubcatA2</option>
 </select>
 </p>
<p>
<label>SubCategoryB</label>
<select class="multiselectbox" name="contact_subcategory_CatB" multiple>
     <option value="SubcatB1">SubcatB1</option>
     <option value="SubcatB2">SubcatB2</option>
</select>
</p>

我正在尝试创建动态 jquery 代码，如果我从多选subcategory_X字段中选择任何选项，则应该在多选中选择相同的子super_category类别

同样，当我从多选中取消选择任何选项 subcategory_X 时，应该取消选择super_category特定多选中的任何/所有选项。subcategory_X

尝试使用 Jquery 执行此操作，但我是新手。正在考虑在事件中执行此操作，onchange这样如果从任何多选中选择/取消选择任何选项，则相应的“类别”要么在“super_category”多选中被选中，要么从“子类别”自己的多选中取消选择所有值。

希望我没有混淆任何人。对此的任何帮助将不胜感激。

提前致谢。

编辑：JSfiddle 链接http://jsfiddle.net/M53JX/

4

1 回答 1

0

尝试这个

$(document).ready(function () {
    $('#mainSelect').on('change', function () {
        $("select[name^=contact_subcategory] option").prop("selected", "");
        var name = $(this).val(); alert(name);
        $(name).each(function() {
            $("select[name=contact_subcategory_" +this  + "] option").prop("selected", "selected"); 
        })

    });
});

小提琴

于 2013-10-29T09:35:55.023 回答