jqueryを使用してチェックボックスをオンにした場合、新しいdivタグを追加する方法

Question

how to 新しいdivタグをに追加すると、チェックボックスがオンになり、2つのチェックボックスをオンにするとdivタグが表示されます。支援し、チェックボックス「ラベルの隣にある、この新しいdiv要素を追加するためにwan't場合、私はあなたのチェックボックスのidのセットを持っていることを確認し、属性のためのその使用作る最初にjqueryの

Answer 1

$(':checkbox').click(function() { 
    if ($(this).attr('checked')) { 
     // create new div 
     var newDiv = $('<div>contents</div>'); 

     // you can insert element like this: 
     newDiv.insertAfter($(this)); 

     // or like that (choose syntax that you prefer): 
     $(this).after(newDiv); 
    } else { 
     // this will remove div next to current element if it's present 
     $(this).next().filter('div').remove(); 
    } 
}); 

を使用して、このモジュールを解決するためにしてくださいチェックボックスとラベルを接続するためのラベルで：

<label for="myCb1">test</label> 
<input type="checkbox" id="myCb1" value="1" /> 

今、あなたは少しだけ上のJSコードを変更することができますし、あなたが行われています。ウル更新のため

$(':checkbox').click(function() { 
    // current checkbox id 
    var id = $(this).attr('id'); 

    // checkbox' label 
    var label = $('label[for=' + id + ']'); 

    if ($(this).attr('checked')) { 
     // create new div 
     var newDiv = $('<div>contents</div>'); 

     // insert div element 
     newDiv.insertAfter(label); 
    } else { 
     // this will remove div next to current element if it's present 
     label.next().filter('div').remove(); 
    } 
});