Question

EXPLANATION：我有两个元素，里面有很多选项。第一个包含一系列选项，其db-id为其值。这些是父母。

第二个元素填充了一个选项列表，这些选项将父db-id作为其值，并将自己的db-id作为其html id-attribute。这些是儿童类别。

问题： 我希望隐藏所有的孩子猫，并且在任何父类别的每个选择事件上，使用与父母的值相同的值使相对的孩子变得可见。

MY ATTEMPTS： 为此，我编写了以下不起作用的脚本。它将click事件附加到每个父类别，并且此事件触发一个函数，该函数负责打开任何子cat的可见性，如果它们的值与所单击元素的值匹配。

HTML CODE：

<select multiple  name="branch" >
<option selected="" value="false">Please Select a Branch</option>
<option class="branch-item" value="0">Computer</option>
<option class="branch-item" value="1">Automobile</option>
<option class="branch-item" value="4">Technical</option>
</select>   

<select multiple class="form-option" name="subbranch" >
<option class="subbranch-item" style="display: none;" value="1">Software</option>
<option class="subbranch-item" style="display: none;" value="1">Hardware</option>
<option class="subbranch-item" style="display: none;" value="7">Mechanics</option>
<option class="subbranch-item" style="display: none;" value="7">Welding</option>   
</select>

JQUERY CODE：

<script type="text/javascript">
    $(document).ready(function(e) {

        $(".branche-item").click(function(){
            var values = $(this).val();
            $('.subbranch-item').parent().each(function(element, value) {
                if(value == values)
                {
                    element.show(); 
                }
            });
        });

    });
</script>

感谢jquery代码调试方面的任何帮助，谢谢

Answer 1

尝试

var $sub = $('select[name="subbranch"]');
var sub = $.trim($sub.html());

$('select[name="branch"]').change(function () {
    var filter = $(this).children('option:selected').map(function () {
        return '[value="' + this.value + '"]'
    }).get().join();

    $sub.empty().append($(sub).filter(filter))
}).change()

演示：Fiddle

Answer 2

$('select[name="branch"]').change(function () {
    var $branch = $(this).children(':selected'),
        $subbranch = $('[name="subbranch"]').children('option');

    $subbranch.hide()

    $branch.each(function () {
        var branch = $(this).val();
        $subbranch.each(function () {
            if ($(this).val() == branch) {
                $(this).show();
            }
        });
    });
}).change();

http://jsfiddle.net/F9777/3/

jQuery每个函数$（这个）混乱

2 个答案: