カテゴリーを選択

Question

私は初心者ですが、私のコードにはちょっと残っています。

私はアレイ内にカテゴリを持っています。それらはドロップダウンボックスにリストされています。

私は、すべてのカテゴリが異なる形式をとることを望みます。映画のような映画は音楽形式を持っています。

<script> 
$('document').ready(function() { 


    $('.valami').change(function() { 
     $('select.valami option:selected').each(function() { 
      var data = $(this).text(); 

       switch(data) { 
        case 'Film': 
         alert('Film'); 
        break; 

        case 'Sorozat': 
         alert('Sorozat'); 
        break; 

        case 'Zene': 
         alert('Zene'); 
        break; 

        case 'XXX': 
         alert('XXX'); 
        break; 

        case 'Játék': 
         alert('Játék'); 
        break; 

        case 'Program': 
         alert('Program'); 
        break; 

        case 'Könyv': 
         alert('Könyv'); 
        break; 

        default: 'Film';     
       } 

     });//each 
    });//change 

    });//ready 

</script> 

ここではコードがありますが、私が動作しているかどうかテストしています。

私の問題は、カテゴリが選択されている場合はフォームをスライドさせてもらうことですが、他のものを選択すると、選択されていないものが隠れてしまいます。

私はその作業はこの

if($('.film').is(':hidden')) { 
$('.film').show(); 
}else { 
    $('.film').hide(); 
} 

ようにしようと試みたが、私はそれがそこにとどまるNotherののcategorieを選択した場合、誰かが私に欠けて何イムヒントを与えることができますか？

はあなたに

HTML

<select name='kategoriak' class='valami'> 
    <?php foreach ($kategoria as $k) { ?> 

    <option value="<?php echo $k['id'] ?>"><?php echo $k['nev'] ?></option> 

    <?php } ?> 
</select> 


<div class='film'>teh form here</div> 

フィルムのような他の形態をありがとう、と私はあなたが非表示にする必要が正しくあなたの質問を理解している場合、そのCSS

Answer 1

これは私がそれを行うだろうかであるために、私はそれが何をしたいんだと思うと私はあなたが異なっそれが必要な場合は私に知らせて、少しあなたのコードを変更しました。

スタティックHTMLを使用して、どのように動作しているかを示しました。

HTML

<select name='kategoriak' class='valami'> 
    <option value="film">Film</option> 
    <option value="sorozat">Sorozat</option> 
    <option value="zene">Zene</option> 
</select> 


<div class="form" id='film'>teh form here</div> 
<div class="form" id='sorozat'>ANOTHER form here</div> 
<div class="form" id='zene'>AND ANOTHER form here</div> 

CSS

<style> 
    div.form { 
     display: none; 
    } 
</style> 

はJavaScript

<script> 
$('document').ready(function() { 
    $('.valami').change(function() { 
     id = $('select.valami option:selected').val(); 

     $('div.form').hide(); 
     $('div#' + id).show(); 
    }); 
}); 
</script> 

Answer 2

の表示なしと定義しますその他のすべてのカテゴリ。 :not() selectorを調べましたか？例

if($('.film').is(':hidden')) { 
$('.film').show(); 
$('div:not(.film)').hide(); 
}