jquery показать общую сумму, если флажок установлен.

-2

Показывает определенные значения флажка, когда отмечены определенные флажки. Его работа прекрасна. Мне нужно показать все значения значений флажков при загрузке страницы, не имеет значения, если он установлен или нет. На данный момент он просто показывает общее количество, когда флажок установлен. Любой, кто поможет мне.jquery показать общую сумму, если флажок установлен.

<html> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> 

<title> Calc</title> 

<script type='text/javascript'> 
$(function() { 
    $(".tot_amount").click(function(event) { 
     var total = 0; 
     $(".tot_amount:checked").each(function() { 
      total += parseInt($(this).val()); 
     }); 
     $("#tot_amount").val(sum.toFixed(3)); 

     if (total == 0) { 
      $('#total1').val(''); 
     } else { 
      $('#total1').val(total); 
     } 
    }); 

}); 
</script> 

</head> 

<body> 
<table border="1"> 
<tr><td>10<input type="checkbox" class="tot_amount" value="10"></td></tr> 
<tr><td>20<input type="checkbox" class="tot_amount" value="20"></td></tr> 
<tr><td>30<input type="checkbox" class="tot_amount" value="30"></td></tr> 
<tr><td>40<input type="checkbox" class="tot_amount" value="40"></td></tr> 
<tr><td>50<input type="checkbox" class="tot_amount" value="50"></td></tr> 
<tr><td>60<input type="checkbox" class="tot_amount" value="60"></td></tr> 
<tr><td>70<input type="checkbox" class="tot_amount" value="70"></td></tr> 

<tr><td>Total<input type="text" id="total1" readonly></td></tr> 
</table> 

</body>

@ Али ... его работы, но у меня есть небольшая проблема. Позволь мне объяснить. Прежде всего, я не могу прокомментировать ваш раздел. когда я нажимаю добавить комментарий, ничего не происходит, поэтому я добавляю свой комментарий здесь. Все это работает. На странице загружается его отображение итогов, и когда я проверяю любые флажки, они показывают сумму. Все хорошо. Но мне нужна еще одна функция. Если я сниму галочку и все флажки, он также должен показывать всю сумму, как и при загрузке страницы. Как это будет достигнуто?

источник

2016-01-12 Sanju Menon

Создать метод

function getTotal(isInit) { 

    var total = 0; 
    var selector = isInit ? ".tot_amount" : ".tot_amount:checked"; 
    $(selector).each(function() { 
    total += parseInt($(this).val()); 
    }); 
    if (total == 0) { 
    $('#total1').val(''); 
    } else { 
    $('#total1').val(total); 
    } 

}

Затем вызовите его как от мыши и нагрузки события

Как это

$(function() { 
    $(".tot_amount").click(function(event) { 
    getTotal(); 
    }); 
    getTotal(true); 
});

DEMO

источник

2016-01-12 04:55:32

не так, как OP сказал- 'значения сумм на странице загрузки, не имеет значения, если его проверка или not'. – Manoj

'Мне нужно показать все значения значений флажков на загрузке страницы, не имеет значения, если он проверен или нет.« Что я делаю неправильно? –

first-its totaling only to checked elements (так как OP сказал, что не имеет значения для проверки) second- в вашем ответе 'sum.toFixed (3)' 'sum' не определен. поэтому он не будет работать. Извините, если я неправильно понял вопрос? – Manoj

Я думаю, что вам нужно общее количество всех значений. написать в

$(document).ready(function(){ 
    var preTotal=0; 

$(".tot_amount").each(function() { 
    preTotal+=parseInt($(this).attr("value")); 
}); 

});

для на странице готового

источник

2016-01-12 04:55:53

function getTotal(objSelector) 
 
{ 
 
    var total = 0; 
 
    objSelector.each(function() { 
 
     total += parseInt($(this).val()); 
 
    }); 
 
    $("#tot_amount").val(total.toFixed(3)); 
 
    if (total == 0) { 
 
     $('#total1').val(''); 
 
    } else { 
 
     $('#total1').val(total); 
 
    } 
 
} 
 
$(document).ready(function() { 
 
    getTotal($(".tot_amount")); 
 
    $(".tot_amount").change(function (event) { 
 
     getTotal($(".tot_amount:checked")); 
 
    }); 
 

 
});

<html> 
 
    <head> 
 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> 
 
     <title>Calc</title> 
 
     
 
    </head> 
 
    <body> 
 
     <table border="1"> 
 
      <tr><td>10<input type="checkbox" class="tot_amount" value="10"></td></tr> 
 
      <tr><td>20<input type="checkbox" class="tot_amount" value="20"></td></tr> 
 
      <tr><td>30<input type="checkbox" class="tot_amount" value="30"></td></tr> 
 
      <tr><td>40<input type="checkbox" class="tot_amount" value="40"></td></tr> 
 
      <tr><td>50<input type="checkbox" class="tot_amount" value="50"></td></tr> 
 
      <tr><td>60<input type="checkbox" class="tot_amount" value="60"></td></tr> 
 
      <tr><td>70<input type="checkbox" class="tot_amount" value="70"></td></tr> 
 
      <tr><td>Total<input type="text" id="total1" readonly></td></tr> 
 
     </table> 
 
    </body> 
 
</html>

источник

2016-01-12 05:08:01

Он работает в соответствии с вашими потребностями. Здесь вы можете запустить код выше. –

Работает ли он? –

Проверьте мои DEMO. Это в соответствии с вашим требование

$(function(){ 
$(".tot_amount").click(function(event) { 
var total = 0; 
$(".tot_amount:checked").each(function() { 
total += parseInt($(this).val()); 
}); 
    //$("#tot_amount").val(sum.toFixed(3)); 

$('#total1').val(total); 

}); 

}); 

$(document).ready(function() { 
var total2=0; 
    $(".tot_amount").each(function() { 
total2 += parseInt($(this).val()); 

}); 


$('#total1').val(total2); 
});

DEMO

источник

2016-01-12 05:21:51

jquery показать общую сумму, если флажок установлен.

ответ

Смежные вопросы