如何從複選框中獲取值並用javascript計算單擊的項目

Question

我需要爲每個複選框獲取值，並在用戶沒有選中任何複選框時將其移動到另一個頁面。

有錯誤，但我不能承認它

$('#Submit').click(function() { 

     if($('#Search').val() == "") 
     {alert('please enter your domain without Extuntison');return false;} 

     results.style.display = 'none'; 
     $('#results').html(''); 
     loading.style.display = 'inline'; 

     $.post('../domain_checker/process.php?domain=' + escape($('#Search').val()),{ 
     }, function(response){ 


      results.style.display = 'block'; 
      $('#results').html(unescape(response)); 
      loading.style.display = 'none'; 

      //$('#results').animate({height : '450px' }, 2000); 

      results.style.height = '400px'; 
     }); 

     return false; 
    }); 


     $(function(){ 
      $('#order_Now').click(function(){ 
      var count = $("[type='checkbox']:checked").length; 
      var val = []; 
      for(i=0;i<count;i++){ 
       $(':checkbox:checked').each(function(i){ 
        val[i] = $(this).val(); 
       }); 
      }  
      }); 
     }); 

與此HTML頁面時加載AJAX

<form action="ordedomain.php" name="formdomain" method="post" id="formdomain" onclick="check_domain_checkBox()"> 

    <div id="results" style="width:450px;" align="left"> 



    </div> 
    </form> 

，並在頁面的PHP通過AJAX這個代碼reloade

 <form action="ordedomain.php" name="formdomain" method="post" id="formdomain" onclick="check_domain_checkBox()"> 

<input type="checkbox" value="a" id="arrDomain" name="arrDomain">a 
<input type="checkbox" value="b" id="arrDomain" name="arrDomain">b 
<input type="checkbox" value="c" id="arrDomain" name="arrDomain">c 

     </form> 

Answer 1

這很簡單：

var vals = []; 
$(":checkbox").each(function() { 
    if (this.checked) 
     vals.push(this.value); 
}); 
var count = vals.length; 

我不確定您的代碼中for -loop在做什麼，因爲您已有each()。

現在，您可以輕鬆地獲得您的submit處理程序中的計數，如果它等於0阻止提交。

另外，如果您需要複選框，則不應使用提交按鈕;你不能使用id多次（它需要是唯一的），使用name屬性改爲：

<form action="ordedomain.php" name="formdomain" method="post" id="formdomain"> 
    <label><input type="checkbox" name="domain" value="1"> Order now 1</label> 
    <label><input type="checkbox" name="domain" value="2"> Order now 2</label> 
    <label><input type="checkbox" name="domain" value="3"> Order now 3</label> 
    <label><input type="checkbox" name="domain" value="4"> Order now 5</label> 
    <input type="text" id="search" name="search"> 
    <div id="results" style="display:none;"></div> 
    <img id="loading" src="…" style="display:none;"></div> 
</form> 

// onDOMready 
var form = $("#formdomain"), 
    search = form.find("#search"), 
    checkboxes = form.find(":checkbox"), 
    results = form.find("#results"), 
    loading = form.find("#loading"); 
form.submit(function(evt) { 
    var sval = search.val(), 
     checked = checkboxes.filter(":checked"), 
     dvals = []; 
    if (!sval) { 
     alert("Please enter domain (without extension)"); 
    } else if (!checked.length) { 
     alert("Please tick at least one domain extension"); 
    } else { 
     checked.each(function() { 
      dvals.push(this.value); 
     }); 
     $.post('../domain_checker/process.php', { 
      domain: sval, 
      extensions: dvals 
     }, function(resonse) { 
      loading.hide(); 
      results.html(response).show(); 
     }); 
     loading.show(); 
     results.hide(); 
    } 
    evt.preventDefault(); 
}); 

Answer 2

你可以通過​​

和

jQuery的

$("#test").click(function() { 
var total_c = 0; 
    $.each($("input[type=checkbox]:checked"), function (k, v){ 
    var val =parseFloat($(this).val()); 
    tot = parseFloat(total_c+ val); 
    }) 
     alert(total_c); 
}); 

HTML得到遏制

<input type="buttoN" id="test" value="click me"/> 

良好的學習

1. jquery checkbox value
2. count values of checked checkbox

Answer 3

嘗試這些（正確的代碼）

var count = $("input[type='checkbox']:checked").length; 

和

​​

閱讀http://api.jquery.com/checked-selector/

Answer 4

我沒有看到任何複選框，您所提供，也是HTML所有4 提交按鈕具有相同的ID值這是錯誤的。這可能是它不工作的原因。您還可以修改你的js代碼，以獲得正確的計數選中的複選框

var vals = []; 
$(":checkbox:checked").each(function() { 
     vals.push($(this).val()); 
});