0

私のjQueryの知識は限られているので、基本的に私はこれに頭を悩ませています。選択メニューリストがあり、選択したメーカーに応じて、それらのモデルがjQueryで表示されます。問題は、誰かが「すべて」を選択した場合にすべてのモデルを表示する方法がわからないことです。誰かが私を助けてくれるなら、私はそれをいただければ幸いです。今、あなたが「すべて」を選択した場合、何も表示されません。また、これはこれを行うための良い方法ですか？ありがとうございました。

http://jsfiddle.net/KAjb7/1/

または以下のコード：

<select class="manufacturers">
<option class="selected" value="all">All</option>
<option value="motorola">Motorola</option>
<option value="htc">HTC</option>
<option value="lg">LG</option>
<option value="samsung">Samsung</option>
<option value="kyocera">Kyocera</option>
</select>


<div class="scroll-content">
  <ul class="manulist motorola">
    <li><a href="#">Motorola Triumph</a></li>
  </ul>
 <ul class="manulist htc">
   <li><a href="#">HTC WILDFIRE S</a></li>
  </ul>
  <ul class="manulist lg">
<li><a href="#">LG Optimus Slider</a></li>
<li><a href="#">LG Optimus V</a></li>
<li><a href="#">LG Rumor Touch</a></li>
<li><a href="#">LG Rumor 2</a></li>
<li><a href="#">LG 101</a></li>
  </ul>
</div>

そしてjQuery：

$(document).ready(function(){

$('.manufacturers').change(function(){
var selected = $(this).find(':selected');
$('ul.manulist').hide();

$('.'+selected.val()).show();
$('.optionvalue').html(selected.html()).
   attr('class', 'optionvalue '+selected.val());
});

});​
4

4 に答える 4

0

選択したアイテムの値を確認し、=='all'の場合はすべてを表示する必要があります。

http://jsfiddle.net/lucuma/WnapS/

$(document).ready(function(){

    $('.manufacturers').change(function(){
    var selected = $(this).find(':selected');
    $('ul.manulist').hide();
        if ($(this).val() == 'all') {
            $('.scroll-content ul').show();
        } else {
    $('.'+selected.val()).show();
    $('.optionvalue').html(selected.html()).
       attr('class', 'optionvalue '+selected.val());
            }
    });

});​
于 2012-05-31T21:04:18.440 に答える
0

これを試して：

    if ($(this).val() == 'all') {
       $('.manulist').show()
    }

http://jsfiddle.net/KAjb7/2/

于 2012-05-31T21:04:46.797 に答える
0

3つのオプション：

  1. すべてのulにクラス「all」を追加します

  2. 変化する

    <option class="selected" value="all">All</option>

    に

    <option class="selected" value="manulist">All</option>

  3. 次の場合に追加

    if (selected.val() == 'all') {
    $('.manulist').show();
} else {
    $('.'+selected.val()).show();
}
于 2012-05-31T21:05:28.347 に答える
0

$（document）.ready（function（）{

$('.manufacturers').change(function(){
    var selected = $(this).find(':selected');

    if ( selected.val() == "all") {
        // console.log("all");
        $('ul.manulist').show();
        } else {
            $('ul.manulist').hide();

    $('.'+selected.val()).show();
    $('.optionvalue').html(selected.html()).
    attr('class', 'optionvalue '+selected.val());
            }

});

}）;

于 2012-05-31T21:06:37.187 に答える