我在javascript中进行计算。记录是从一个工作正常的php文件生成的,我的javascript工作两行,但是如果我从HTML中删除一行,则脚本不会计算任何字段。
有3个重要字段:总INR,添加(%)和总价值。如果我添加一个百分比,比如12,那么javascript应该计算总INR的12%并将其写入总值。这是基本情景。我真的很困惑,为什么它不能用于单行。
脚本如下:
function calcTotals()
{
var grandTotal = 0;
var i = 0;
while (document.forms['cart'].elements['add_percentage[]'][i])
{
add_percentageObj = document.forms['cart'].elements['add_percentage[]'][i];
addon_valueObj = document.forms['cart'].elements['addon_value[]'][i];
total_inr_valueObj = document.forms['cart'].elements['total_inr[]'][i];
totalObj = document.forms['cart'].elements['add_value[]'][i];
priceunitObj = document.forms['cart'].elements['price_unit[]'][i];
qtyObj = document.forms['cart'].elements['qty[]'][i];
if (isNaN(add_percentageObj.value))
{
add_percentageObj = '';
}
if (isNaN(addon_valueObj.value))
{
addon_valueObj = '';
}
if (add_percentageObj.value !=0)
{
totalObj.value = Math.round((total_inr_valueObj.value*1) * add_percentageObj.value/100)+ total_inr_valueObj.value*1;
grandTotal = grandTotal + parseFloat(totalObj.value);
}
else if (addon_valueObj.value)
{
totalObj.value = Math.round((addon_valueObj.value*1) + total_inr_valueObj.value*1);
grandTotal = grandTotal + parseFloat(totalObj.value);
}
else
{
totalObj.value = Math.round((addon_valueObj.value*1) + total_inr_valueObj.value*1);
grandTotal = grandTotal + parseFloat(totalObj.value);
}
i++;
}
document.getElementById('grand_total').value = grandTotal;
return;
}
它适用于此HTML,但如果我删除标有“第二行”注释的div,则会停止工作:
<form name='cart' method='post' class='single' action='generate_quot_cust_edititems_save_complete.php?tender_id=388' >
<input type='hidden' name='sum_input' id='sum_input' value=''>
<div class="base">
<table width="100%" border="1" style="border-collapse: collapse;" cellpadding="1" cellspacing="1">
<tr>
<td width='19%' id='addinput'>Description</td>
<td width='8%'>Qty</td>
<td width='5%'>Unit Price</td>
<td width='8%'>Total INR</td>
<td width='5%' >Add (%)</td>
<td width='7%'>Add Value</td>
<td width='6%'>Total Value</td>
<td width='8%'>Price/Unit</td>
</tr>
<!-- First Row -->
<tr>
<td width='19%' id='addinput'>
<input type='text' size='23' id='item_name0' name='item_name[0]' placeholder='C-BAND DOWNCONVERTERS (type 1)' value='C-BAND DOWNCONVERTERS (type 1)' />
</td>
<td width='8%'>
<input size='1' class='qty' type='text' name='qty[]' id='qty[]' value='15' readonly/>
</td>
<td width='5%'>
<input size='3' type='text' name='unitprice[0]' value='120' readonly/>
</td>
<td width='8%'>
<input size='7' type='text' id='total_inr[]' name='total_inr[]' value='116798'/>
</td>
<td width='5%' >
<input class='' size='4' type='text' id='add_percentage[]' name='add_percentage[]' value='12' onchange='calcTotals()'>
</td>
<td width='7%'>
<input class='txt' type='text' size='7' id='addon_value[]' name='addon_value[]' value='0' onchange='calcTotals()'>
</td>
<td width='6%'>
<input class='total' data-value='130814' size='6' type='text' id='add_value[]' name='add_value[]' value='130814' readonly>
</td>
<input type="hidden" class="inrvalue" id="inrvalue" name="inrvalue" value="64.887881">
<input type="hidden" class="deptip" id="dept-input"/>
<input type="hidden" class="priceip" id="price-input"/>
<td width='8%'>
<input class='price_unit' size='7' type='text' id='price_unit[]' name='price_unit[]' value='134.4' readonly>
</td>
</tr>
</table>
</div>
<!-- Second Row -->
<div class="base">
<table width="100%" border="1" style="border-collapse: collapse;" cellpadding="1" cellspacing="1">
<tr>
<td width='19%' id='addinput'>
<input type='text' size='23' id='item_name1' name='item_name[1]' placeholder='C-BAND DOWNCONVERTERS (type 2)' value='C-BAND DOWNCONVERTERS (type 2)' />
</td>
<td width='8%'>
<input size='1' class='qty' type='text' name='qty[]' id='qty[]' value='15' readonly/>
</td>
<td width='5%'>
<input size='3' type='text' name='unitprice[1]' value='180' readonly/>
</td>
<td width='8%'>
<input size='7' type='text' id='total_inr[]' name='total_inr[]' value='175197'/>
</td>
<td width='5%' >
<input class='' size='4' type='text' id='add_percentage[]' name='add_percentage[]' value='0' onchange='calcTotals()'>
</td>
<td width='7%'>
<input class='txt' type='text' size='7' id='addon_value[]' name='addon_value[]' value='19000' onchange='calcTotals()'>
</td>
<td width='6%'>
<input class='total' data-value='194197' size='6' type='text' id='add_value[]' name='add_value[]' value='194197' readonly>
</td>
<input type="hidden" class="inrvalue" id="inrvalue" name="inrvalue" value="64.887881">
<input type="hidden" class="deptip" id="dept-input"/>
<input type="hidden" class="priceip" id="price-input"/>
<td width='8%'>
<input class='price_unit' size='7' type='text' id='price_unit[]' name='price_unit[]' value='199.521' readonly>
</td>
</tr>
</table>
</div>
<table width='100%'>
<tr>
<td width='3%'> </td>
<td width='4%'> </td>
<td width='17%'> </td>
<td width='5%'> </td>
<td width='5%'> </td>
<td width='6%'> </td>
<td width='5%'> </td>
<td width='7%'> </td>
<td width='8%'> </td>
<td width='5%'> </td>
<td height=35>
<b>Grand Total: <input style='font-weight: bold' name='gTotal' id='grand_total' value='325011' readonly /></b>
</td>
</tr>
<tr>
</table>
<br>
<table>
<td>
<input type='submit' value='--Save Data--' id='continue'/>
</td>
</tr>
</table>
</form>
答案 0 :(得分:3)
只有一个元素name=add_percentage[]
document.forms['cart'].elements['add_percentage[]']
不再是类似数组的对象 - 因此
document.forms['cart'].elements['add_percentage[]'][0]
将是未定义的,而while循环将永远不会运行
解决这个问题:
替换
行while (document.forms['cart'].elements['add_percentage[]'][i])
使用:
var elements;
if (document.forms['cart'].elements['add_percentage[]'][0]) {
// it's an array, so all good
elements = document.forms['cart'].elements['add_percentage[]']
} else {
// not an array, so make it a single element array
elements = [document.forms['cart'].elements['add_percentage[]']];
}
while(elements[i]) {
这是一个(希望完全正常工作)的解决方案 - 添加了函数getIndexedElement
- 它可以完成所有的工作,并且意味着对逻辑的最小更改
function getIndexedElement(item, index) {
if (item.length) {
if (index < item.length) {
return item[index];
}
else {
return false;
}
}
else {
if (index === 0) {
return item;
}
}
return false;
}
function isNum(value) {
return 123;
}
function calcTotals() {
var grandTotal = 0;
var i = 0;
while (getIndexedElement(document.forms['cart'].elements['add_percentage[]'], i)) {
add_percentageObj = getIndexedElement(document.forms['cart'].elements['add_percentage[]'], i);
addon_valueObj = getIndexedElement(document.forms['cart'].elements['addon_value[]'], i);
total_inr_valueObj = getIndexedElement(document.forms['cart'].elements['total_inr[]'], i);
totalObj = getIndexedElement(document.forms['cart'].elements['add_value[]'], i);
priceunitObj = getIndexedElement(document.forms['cart'].elements['price_unit[]'], i);
qtyObj = getIndexedElement(document.forms['cart'].elements['qty[]'], i);
if (isNaN(add_percentageObj.value)) {
add_percentageObj = '';
}
if (isNaN(addon_valueObj.value)) {
addon_valueObj = '';
}
if (add_percentageObj.value != 0) {
totalObj.value = Math.round((total_inr_valueObj.value * 1) * add_percentageObj.value / 100) + total_inr_valueObj.value * 1;
grandTotal = grandTotal + parseFloat(totalObj.value);
//priceunitObj.value = total1Obj.value/qtyObj.value;
//c.value=Math.round((b.value/100) *a.value ).toFixed(2);
} else if (addon_valueObj.value) {
totalObj.value = Math.round((addon_valueObj.value * 1) + total_inr_valueObj.value * 1);
grandTotal = grandTotal + parseFloat(totalObj.value);
//priceunitObj.value = total1Obj.value/qtyObj.value;
} else {
totalObj.value = Math.round((addon_valueObj.value * 1) + total_inr_valueObj.value * 1);
grandTotal = grandTotal + parseFloat(totalObj.value);
//priceunitObj.value = total1Obj.value/qtyObj.value;
}
i++;
}
document.getElementById('grand_total').value = grandTotal;
return;
}