動的チェックボックスでチェックカウントを取得するJavaScript

Question

DBデータに従って動的に画面をデザインするために、次のコードを使用しています。

function RefillUI(data) { 
var html = ""; 
$.each(data, 
    function (i, item) { 
     $('#patientName').html(item.PatientName); 
     html += "<div class='col-md-3'> <div class='card'><div class='card_header'><h5>" + 
      item.DrugName + 
      "</h5></div><div class='card_body'>" + 
      "<div class='col-md-12'></div><ul class='col-md-6'><li class='bold'>Ref #</li><li class='bold'>" + 
      item.ReferenceNo + 
      "</li>" + 
      "</ul><ul class='col-md-6'><li class='center'>Refills</li><li class='fill'>1</li></ul>" + 
      "<table class='table table-bordered table-inverse'><tbody><tr><th>Prescriber</th><td>" + 
      item.PatientName + 
      "</td>" + 
      "</tr><tr><th>Last filled</th><td>Nov 14 2014</td></tr><tr><th>Next fill</th><td>Oct 16 2016</td></tr>" + 
      "<tr><th>Qty</th><td>" + 
      item.LastRefillQty + 
      "</td></tr><tr><th>Last Filled Dispensory</th><td>" + 
      item.LastRefillDispensory + 
      "</td></tr></tbody></table><form action='' class='cta center bold'>" + 
      "<label><input name='refill' type='checkbox' value='refill'>Refill</label></form></div></div></div>"; 
    }); 


$('#refillcards').html(html); 

}

今、私はボタンをクリックすると、多くのチェックボックスがオンになっているか確認したいです。これどうやってするの？

Answer 1

私は純粋なJavaScriptで答えを知っている：

まず、先頭にこの宣言を置く：

checkboxes = []; // No `var', it's global 

これは、特定の選択を確認するにはもの

function 
init (n) 
{ 
    // n is the number of check boxes 
    checkboxes[0] = document.getElementById ('some-id'); 
    checkboxes[1] = document.getElementById ('other-id'); 
    // ... 
    checkboxes[n - 1] = document.getElementById ('different-id'); 
} 

を初期化しますチェックボックスをオンにします。

次に、あなたがしたい場合は、あなたがより良い選択と入力を置き換えることができ、その後

function 
count() 
{ 
    var ret = 0; 
    for (var n = 0; n < checkboxes.length; n++) 
    { 
     if (checkSelect (n)) 
     { 
      ret = ret + 1; 
     } 
    } 
    return ret; 
} 

Answer 2

var n = $("input:checked").length; 

のすべてを数えます。