0

我有一个正在运行的脚本，可以根据选择的下拉选项显示/隐藏 div。

在用户在下拉列表中进行选择之前，我需要隐藏除第一个 div 之外的所有 div。

根据下面的脚本，如何从除第一个选项之外的所有选项中获取值，以便隐藏除第一个 div 之外的所有 div？

$('.dd-show-hide').find('option:not(:first)').val().hide();

$('.dd-show-hide').change(function(){
   $(this).find('option').each(function(){
      $('#' + this.value).hide();
    });
    $('#' + this.value).show();
});


<select class="dd-show-hide">
    <option>Choose</option>
    <option value="div1">Show Div 1</option>
    <option value="div2">Show Div 2</option>
</select>

<div  id="div1" class="drop-down-show-hide">div 1</div>
<div  id="div2" class="drop-down-show-hide">div 2</div>
4

3 回答 3

3

Well you can use first selector and not method:

$('.drop-down-show-hide').not(':first').hide();

Or trigger the change event, there is no need to use the each method.

var $divs = $('.drop-down-show-hide');
$('.dd-show-hide').change(function(){
   $divs.hide().filter('[id='+this.value+']').show();
}).change();
于 2013-02-07T20:52:11.630 回答
0

一般来说，当我必须在JQuery中“隐藏除_之外的所有东西”时，我发现将它们全部隐藏起来更方便，然后显示我想要的那个。这隐藏了除第一个之外的所有内容：

$('.drop-down-show-hide').hide().first().show();

这将根据当前选择的选项隐藏：

$('.drop-down-show-hide').hide().filter('#' + $('.dd-show-hide').val()).show();

这基于第一个选项隐藏（即使不一定是现在选择的那个）

$('.drop-down-show-hide').hide().filter('#'+$('.dd-show-hide option:first').val()).show()

您无需一一浏览这些 ID。要仅显示在下拉列表中选择的一项并隐藏其他项：

$('.dd-show-hide').change(function() {
   $('.drop-down-show-hide').hide().filter('#' + this.value).show();
});
于 2013-02-07T20:53:23.247 回答
0

尝试这个。你几乎拥有它：

$('.dd-show-hide').find('option').each(function(){
      if ('div1' != this.value) {
          $('#' + this.value).hide();
      } else {
          $('#' + this.value).show();
      }
 });
于 2013-02-07T20:53:43.687 回答