|
|
02.11.2016, 13:54
|
|
Профессор
|
|
Регистрация: 15.09.2015
Сообщений: 180
|
|
|
Сумма инпутов
Как в result2 составить сумму инпут, возле которых отмечены чекбоксы?
<input type="checkbox" name="n1" value="1" id="n1" /><input type="text" name="f1" id="f1" value="100"><br />
<input type="checkbox" name="n2" value="2" id="n2" /><input type="text" name="f2" id="f2" value="30"><br />
<input type="checkbox" name="n3" value="3" id="n3" /><input type="text" name="f3" id="f3" value="60"><br />
<input type="checkbox" name="n4" value="4" id="n4" /><input type="text" name="f4" id="f4" value="50"><br />
<input id="result"><input id="result2">
<script>
$("input").click(function() {
var sum = 0;
$("input:checked").each(function(){
sum+= +$(this).val();
});
$('#result').val(sum);
});
</script>
|
|
02.11.2016, 14:18
|
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
<input type="checkbox" name="n1" value="1" id="n1" /><input type="text" name="f1" id="f1" value="100"><br />
<input type="checkbox" name="n2" value="2" id="n2" /><input type="text" name="f2" id="f2" value="30"><br />
<input type="checkbox" name="n3" value="3" id="n3" /><input type="text" name="f3" id="f3" value="60"><br />
<input type="checkbox" name="n4" value="4" id="n4" /><input type="text" name="f4" id="f4" value="50"><br />
<input id="result"><input id="result2">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$("input").click(function() {
var sum = 0, sum2 = 0;
$("input:checked").each(function(){
sum+= +$(this).val();
sum2 += +$(this).next().val();
});
$('#result').val(sum);
$('#result2').val(sum2);
});
</script>
|
|
02.11.2016, 16:17
|
|
Профессор
|
|
Регистрация: 15.09.2015
Сообщений: 180
|
|
Dilettante_Pro,
спасибо большое, еще одно, между инпутами есть спан, можно сделать чтобы при клике по спану, отмечался чекбокс?
<input type="checkbox" name="n1" value="1" id="n1" /><span>100</span><input type="hidden" name="f1" id="f1" value="100"><br />
<input type="checkbox" name="n2" value="2" id="n2" /><span>30</span><input type="hidden" name="f2" id="f2" value="30"><br />
<input type="checkbox" name="n3" value="3" id="n3" /><span>60</span><input type="hidden" name="f3" id="f3" value="60"><br />
<input type="checkbox" name="n4" value="4" id="n4" /><span>50</span><input type="hidden" name="f4" id="f4" value="50"><br />
<input id="result"><input id="result2">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$("input").click(function() {
var sum = 0, sum2 = 0;
$("input:checked").each(function(){
sum+= +$(this).val();
sum2 += +$(this).next().next().val();
});
$('#result').val(sum);
$('#result2').val(sum2);
});
</script>
|
|
02.11.2016, 16:31
|
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
Sav2907,
а может, лишнее убрать?
<label><input type="checkbox" name="n1" value="1" id="n1" />100</label><br />
<label><input type="checkbox" name="n2" value="2" id="n2" />30</label><br />
<label><input type="checkbox" name="n3" value="3" id="n3" />60</label><br />
<label><input type="checkbox" name="n4" value="4" id="n4" />50</label><br />
<input id="result"><input id="result2">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$("input").click(function() {
var sum = 0, sum2 = 0;
$("input:checked").each(function(){
sum+= +$(this).val();
sum2 += +$(this).parent().text();
});
$('#result').val(sum);
$('#result2').val(sum2);
});
</script>
|
|
02.11.2016, 16:55
|
|
Профессор
|
|
Регистрация: 15.09.2015
Сообщений: 180
|
|
Dilettante_Pro,
Спасибо, а если это таблица, можно по клику tr?
<table style="width: 300px; background: #E6E6E6;">
<tr><td><label><input type="checkbox" name="n1" value="1" id="n1" />100</label></td></tr>
<tr><td><label><input type="checkbox" name="n2" value="2" id="n2" />30</label></td></tr>
<tr><td><label><input type="checkbox" name="n3" value="3" id="n3" />60</label></td></tr>
<tr><td><label><input type="checkbox" name="n4" value="4" id="n4" />50</label></td></tr>
</table>
<input id="result"><input id="result2">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$("input").click(function() {
var sum = 0, sum2 = 0;
$("input:checked").each(function(){
sum+= +$(this).val();
sum2 += +$(this).parent().text();
});
$('#result').val(sum);
$('#result2').val(sum2);
});
</script>
Последний раз редактировалось Sav2907, 02.11.2016 в 17:27.
|
|
02.11.2016, 18:09
|
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
Еще что придумаете?
<table border="1" style="width: 300px; background: #E6E6E6;">
<tr><td><label><input type="checkbox" name="n1" value="1" id="n1" />100</label></td></tr>
<tr><td><label><input type="checkbox" name="n2" value="2" id="n2" />30</label></td></tr>
<tr><td><label><input type="checkbox" name="n3" value="3" id="n3" />60</label></td></tr>
<tr><td><label><input type="checkbox" name="n4" value="4" id="n4" />50</label></td></tr>
</table>
<input id="result"><input id="result2">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$('tr').click(function() {
$(this).find('input').click();
});
$("label").click(function(event) {
event.stopPropagation();
});
$("input").click(function(event) {
event.stopPropagation();
var sum = 0, sum2 = 0;
$("input:checked").each(function(){
sum+= +$(this).val();
sum2 += +$(this).parent().text();
});
$('#result').val(sum);
$('#result2').val(sum2);
});
</script>
Последний раз редактировалось Dilettante_Pro, 02.11.2016 в 18:15.
|
|
02.11.2016, 23:19
|
|
Профессор
|
|
Регистрация: 15.09.2015
Сообщений: 180
|
|
|
Dilettante_Pro,
это все, спасибо
|
|
02.11.2016, 23:26
|
|
Профессор
|
|
Регистрация: 15.09.2015
Сообщений: 180
|
|
Dilettante_Pro,
почему не так?
<table border="1" style="width: 300px; background: #E6E6E6;">
<tr><td><label><input type="checkbox" name="n1" value="1" id="n1" />100</label></td></tr>
<tr><td><label><input type="checkbox" name="n2" value="2" id="n2" />30</label></td></tr>
<tr><td><label><input type="checkbox" name="n3" value="3" id="n3" />60</label></td></tr>
<tr><td><label><input type="checkbox" name="n4" value="4" id="n4" />50</label></td></tr>
</table>
<input id="result"><input id="result2">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$('tr').click(function() {
$(this).find('input').click();
});
$("input").click(function() {
var sum = 0, sum2 = 0;
$("input:checked").each(function(){
sum+= +$(this).val();
sum2 += +$(this).parent().text();
});
$('#result').val(sum);
$('#result2').val(sum2);
});
</script>
Последний раз редактировалось Sav2907, 02.11.2016 в 23:28.
|
|
03.11.2016, 10:38
|
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
Sav2907,
|
Сообщение от Sav2907
|
Dilettante_Pro,
почему не так?
|
В таком варианте не работает клик по чекбоксу и цифрам
(точнее, работает, но дважды - из-за всплывания события. Поэтому выбор срабатывает и отменяется)
|
|
|
|
