试图乘以复选框的数值,但它以字符串形式返回。我的示例在JSFiddle https://jsfiddle.net/shiataz12/mjnqth3L/1/
上这些选项代表一个POST值,它将根据该数字将里程数和其他选项的值相乘。
我已经尝试过对准备运行函数的文档进行检查,但效果并不理想,我将函数分为两个范围,并返回了字符串。
JSfiddle链接中提供了代码,以方便参考。
$(document).ready(function(){
$('input[name="checkbox1"]').click(function(){
$('input[name="checkbox2"]').prop('checked', false);
});
$('input[name="checkbox2"]').click(function(){
$('input[name="checkbox1"]').prop('checked', false);
});
$('input[name="checkbox1"]').checked(function(){
displayVals1();
});
});
var $cbs4 = $("#qr3");
function displayVals1() {
Calculate1();
Calculate2();
var singleValues1 = $("#qr1").val();
$cbs4.each(function() {
if (this.checked)
singleValues1 = parseInt(singleValues1) + parseInt(this.value);
});
$("#pricef1").text(singleValues1);
}
var $cbs5 = $("#qr3");
function displayVals2() {
Calculate3();
Calculate4();
var singleValues2 = $("#qr2").val();
$cbs4.each(function() {
if (this.checked)
singleValues2 = parseInt(singleValues2) + parseInt(this.value);
});
$("#pricef1").text(singleValues2);
}
var $cbs = $("#qr3");
function Calculate1() {
var kms1 = $("#qr1").val();
var total = $("#mySelect").val();
$cbs.each(function() {
if (this.checked)
total = parseInt(total) * parseInt(this.value);
kms1 = parseInt(total) * parseInt(kms1);
});
$("#usertotal").text('R ' + total + kms1 +'/day');
}
var $cbs1 = $("#qr3");
function Calculate2() {
var total1 = $("#qr1").val();
$cbs1.each(function() {
if (this.checked)
total1 = parseInt(total1) + parseInt(this.value);
});
$("#userdaily").text('R ' + total1 +'/day');
}
var $cbs2 = $("#qr3");
function Calculate3() {
var kms2 = $("#qr2").val();
var total2 = $("#mySelect").val();
$cbs2.each(function() {
if (this.checked)
total2 = parseInt(total2) * parseInt(this.value);
kms2 = parseInt(total2) * parseInt(kms2);
});
$("#usertotal").text('R ' + total2 + kms2 +'/day');
}
var $cbs3 = $("#qr3");
function Calculate4() {
var total3 = $("#qr2").val();
$cbs3.each(function() {
if (this.checked)
total3 = parseInt(total3) + parseInt(this.value);
});
$("#userdaily").text('R ' + total3 +'/day');
}
$("#qr1").change(displayVals1);
displayVals1();
$("#qr2").change(displayVals2);
displayVals2();
//For checkboxes
// WHEN CHECKBOX CLICKED OR CHECKED - RUN CALCUSAGE //
$cbs.click(Calculate1);
$cbs1.click(Calclate2);
答案 0 :(得分:1)
罪魁祸首是这条线:
$("#usertotal").text('R ' + total + kms1 +'/day');
在这里您要连接一个字符串。首先做数学
var sum = total + kms1;
然后将此值添加到您的字符串中:
$("#usertotal").text('R ' + sum +'/day');**
答案 1 :(得分:0)
尝试这样。
您正在同一行中进行concat和添加。这就是这里的问题。
$(document).ready(function(){
$('input[name="checkbox1"]').click(function(){
$('input[name="checkbox2"]').prop('checked', false);
var n = $( "input[name='checkbox1']:checked" ).length;
if(n){
displayVals1();
}
});
$('input[name="checkbox2"]').click(function(){
$('input[name="checkbox1"]').prop('checked', false);
});
displayVals1();
});
var $cbs4 = $("#qr3");
function displayVals1() {
Calculate1();
Calculate2();
var singleValues1 = $("#qr1").val();
$cbs4.each(function() {
if (this.checked)
singleValues1 = parseInt(singleValues1) + parseInt(this.value);
});
$("#pricef1").text(singleValues1);
}
var $cbs5 = $("#qr3");
function displayVals2() {
Calculate3();
Calculate4();
var singleValues2 = $("#qr2").val();
$cbs4.each(function() {
if (this.checked)
singleValues2 = parseInt(singleValues2) + parseInt(this.value);
});
$("#pricef1").text(singleValues2);
}
var $cbs = $("#qr3");
function Calculate1() {
var kms1 = $("#qr1").val();
var total = $("#mySelect").val();
var fullTot = 0;
$cbs.each(function() {
if (this.checked)
total = parseInt(total) * parseInt(this.value);
kms1 = parseInt(total) * parseInt(kms1);
});
fullTot = parseInt(total) + parseInt(kms1);
$("#usertotal").text('R ' + fullTot +'/day');
}
var $cbs1 = $("#qr3");
function Calculate2() {
var total1 = $("#qr1").val();
$cbs1.each(function() {
if (this.checked)
total1 = parseInt(total1) + parseInt(this.value);
});
$("#userdaily").text('R ' + total1 +'/day');
}
var $cbs2 = $("#qr3");
function Calculate3() {
var kms2 = $("#qr2").val();
var total2 = $("#mySelect").val();
var fullTot2 = 0
$cbs2.each(function() {
if (this.checked)
total2 = parseInt(total2) * parseInt(this.value);
kms2 = parseInt(total2) * parseInt(kms2);
});
fullTot2 = parseInt(total2) + parseInt(kms2);
$("#usertotal").text('R ' + fullTot2 +'/day');
}
var $cbs3 = $("#qr3");
function Calculate4() {
var total3 = $("#qr2").val();
$cbs3.each(function() {
if (this.checked)
total3 = parseInt(total3) + parseInt(this.value);
});
$("#userdaily").text('R ' + total3 +'/day');
}
$("#qr1").change(displayVals1);
displayVals1();
$("#qr2").change(displayVals2);
displayVals2();
//For checkboxes
// WHEN CHECKBOX CLICKED OR CHECKED - RUN CALCUSAGE //
$cbs.click(Calculate1);
$cbs1.click(Calculate2);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="mySelect">No. Days</label>
<select name="mySelect" id="mySelect">
<option name="one" value="1">1</option>
<option name="two" value="2">2</option>
<option name="three" value="3">3</option>
<option name="four" value="4">4</option>
<option name="five" value="5" selected>5</option>
</select><br><br>
<label for="checkbox1">100kms</label>
<input type="checkbox" name="checkbox1" value="125" id="qr1" checked><br><br>
<label for="checkbox2">200kms</label>
<input type="checkbox" name="checkbox2" value="225" id="qr2"><br><br>
<label for="checkbox3">tyre</label>
<input type="checkbox" name="checkbox3" value="20" id="qr3"><br><br>
<label for="checkbox4">glass</label>
<input type="checkbox" name="checkbox4" value="20" id="qr3"><br><br>
Daily :<span id="userdaily"> </span><br><br>
Total :<span id="usertotal"> </span>