複数のチェックボックススクリプトがお互いに介入しています

Question

素晴らしいメンバーがここに表示されるデータを格納する複数のチェックボックスの例を設定するのに役立ちました。しかし、私がこれらの複数を実行しようとすると、変数を変更したときにも、それらは相互にインターラップし、div内に同じデータを表示します。

は、私がここに簡単な例を設定します。input[type="checkbox"]:checked

これを：http://jsfiddle.net/pufamuf/vrpMc/4/

があなたの時間皆:)

Answer 1

あなたは、両方のイベントハンドラで同じセレクタを使用しているためだありがとうページ内のすべてのチェックボックス入力を選択します。

代わりに、input[name="car[]"]:checkedとinput[name="phone[]"]:checked を使用して、その都度、指定された名前の入力のみを選択する必要があります。

Answer 2

両方の機能で、選択したすべてのチェックボックスを選択しています。私の修正（と他の誰かが良いかもしれない）は、唯一のidsをulの周囲に追加することです。

HTML：あなたは$を変更することができ

<ul id='electronics'> 
<li><input type="checkbox" name="phone[]" value="Nokia" />Nokia</li> 

そのように（ '＃が提出'）このような何かにハンドラをクリックします。

$('#submit').click(
    function() 
    { 
     var htmls = ""; 
     $('ul#electronics>li>input[type="checkbox"]:checked').each(
      function() 
      { 
       htmls += $(this).val() + " "; 
      } 
     ); 

     $('.here').html(htmls); 
    } 
); 

は、詳細はhttp://api.jquery.com/id-selector/をhttp://api.jquery.com/child-selector/をチェックしてください。

基本的には、この変更や類似の変更がなければ、カーブランドのリストとエレクトロニクスブランドのリストを区別することはできません。また、クリックハンドラーはチェックボックスをすべて考慮します。