jquery获取数组的选择选项

Question

我有点卡住了 - 大概很容易解决问题。

我想创建将用于网站上所有选择元素的代码。

根据分配给“选项”的“标签”属性，我想隐藏所有其他“div”元素，这些元素的类与此特定“选择”菜单中“选项”的其他“标签”值相同。

让我演示一下：

 <select class="sel_depend" id="reg_where_heard" name="where_heard">
    <option value="">Select one…</option>
    <option value="1">Google</option>
    <option value="2">Yahoo</option>
    <option value="3" label="where_heard_magazine">Magazine</option>
    <option value="4" label="where_heard_other">Other</option>
</select>

<div class="where_heard_magazine dn"><input type="text" name="magazine" id="magazine" value="" /></div>
<div class="where_heard_other dn"><input type="text" name="other" id="other" value="" /></div>

现在 - 菜单下 div 中的“dn”类只分配了“display:none”。

取决于所选的选项 - 如果它的值为 3 - 我希望 div 的类与显示的标签相同 - 然后如果我选择值为 4 的选项 - 所有其他 div（其中类名将从这个选择元素的所有选项）应该隐藏（）并且只选择显示（）。

我不太确定如何将特定“选择”元素的所有“选项”元素放入数组中。 然后大概我可以使用 each() 语句循环遍历它并找出它们是否具有“标签”，如果有，则隐藏具有与其值匹配的类的元素。

然后在循环之后，我可以显示与所选“选项”的“标签”参数值匹配的类的元素。

我希望这是有道理的。

知道如何实现吗？

非常感谢。

Answer 1

为所有与特定选择相关的 div 指定一个类，该类是该元素的名称。那么您可以执行以下操作：

$('.sel_depend').change(function(){
    var class = $(this).attr('name');
    $('.' + class).hide();
    var divToShowClass = $(this).find(':selected').attr('label');
    $('.' + divtoShowClass).show();

});

Answer 2

  $('.sel_depend').change(function() {
    var optionWithLabels = $('.sel_depend').children("option[label]");
    if($("option:selected", this).attr('label')) {
        optionWithLabels.each(function(){
            $('.' + $(this).attr('label')).hide();
        });
        $('.' + $("option:selected", this).attr('label')).show();
    }
  });