Проверка chekbox масива и сложения их значений
Добрый день есть такой массив чекбоксов
<input type='chekbox' name='chec' id='chec' value='1000'>
<input type='chekbox' name='chec' id='chec' value='100'>
<input type='chekbox' name='chec' id='chec' value='10'>
<input type='chekbox' name='chec' id='chec' value='1'>
мне надо их проверить нажали их или нет и если из этих чекбоксов которые нажали, надо взять все нажатые и сложить их значения. например если нажали 1 и 4 то на отправку из формы пойдёт 1001. если нажали все 4 то на отправку идёт 1111 Подскажите как это можно осуществить? |
Во-первых, дать им разные id. Например, checkbox1, checkbox2 и т.д.
Дальше в цикле проверять document.getElementById('checkbox' + i).checked и формировать итоговую сумму. |
решение на jquery
function get_checked_sum(){
checked = $("input:checked");
sum = 0;
for(i=0;i<checked.lenght;i++){
sum += parseInt(checked.eq(i).val(),10);
}
return sum
}
|
<div id="checks">
<input type="checkbox" value="1000">
<input type="checkbox" value="100">
<input type="checkbox" value="10">
<input type="checkbox" value="1">
</div>
<script>
document.getElementById('checks').onclick = function()
{
var chec = document.getElementById('checks').getElementsByTagName('input');
var sum = 0;
for(i=0;i<chec.length;i++)
{
if(chec[i].checked)
{
sum += (chec[i].value*1);
}
}
alert(sum);
}
</script>
|
<input type='checkbox' name='chec' id='chec' value='1000'>
<input type='checkbox' name='chec' value='100'>
<input type='checkbox' name='chec' value='10'>
<input type='checkbox' name='chec' value='1'>
<input type = "button" id = "show" value = "show me">
<script>
function getCheckboxesValues( name ) {
var x, result = "", checkboxes = document.getElementsByName( name );
for ( x = 0; x < checkboxes.length; x++ ) {
result += checkboxes[ x ].checked ? checkboxes[ x ].value : ""
}
return result
}
document.getElementById( "show" ).onclick = function() {
alert( getCheckboxesValues( "chec" ) )
}
</script>
checkbox, а не chekbox И одинаковые id делать не стоит. |
GuardCat, es5, не? ) И stringToNumber.
|
nerv_, ТС хочет именно стринги складывать, как я понял. А что ES5? использовать querySelectorAll?
|
GuardCat, http://es5.javascript.ru/x15.4.html#x15.4.4.21
<input type='checkbox' name='chec' id='chec' value='1000'>
<input type='checkbox' name='chec' value='100'>
<input type='checkbox' name='chec' value='10'>
<input type='checkbox' name='chec' value='1'>
<input type = "button" id = "show" value = "show me">
<script>
function getCheckboxesValues( name ) {
return Array.prototype.reduce.call( document.getElementsByName( name ), function( sum, input ) {
return sum += input.checked ? input.value : '';
}, '' );
}
document.getElementById( "show" ).onclick = function() {
alert( getCheckboxesValues( "chec" ) )
}
</script>
|
nerv_, даже не подумал об этом. Спасибо.
|
function valuesSum()
{
var sum = 0;
var checks = document.getElementsByName('chec[]');
for(var i = 0; i < checks.length; i++)
{
if(checks[i].checked)
sum += parseInt(checks[i].value, 10);
}
return sum;
}
window.onload = function()
{
document.getElementById('btn').onclick = function()
{
var sum = valuesSum();
alert(sum);
}
}
Это я воплатил в жизнь но проблема стала в другом когда выбираются данные из базы если допустим туда занесли данные два последних чекбокса и получили результат 11 а как поправить функцию в джаве чтобы если первые два не выбрал передавалось значение текстом 0011 (( если выбрали нижних 3 то результат был 0111 надо чтобы приходило четыри цифра |
| Часовой пояс GMT +3, время: 19:20. |