关于javascript / jquery计算的奇怪错误

时间:2015-09-12 11:43:19

标签: javascript jquery

我在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%'>&nbsp;</td>
      <td width='4%'>&nbsp;</td>
      <td width='17%'>&nbsp;</td>
      <td width='5%'>&nbsp;</td>
      <td width='5%'>&nbsp;</td>
      <td width='6%'>&nbsp;</td>
      <td width='5%'>&nbsp;</td>
      <td width='7%'>&nbsp;</td>
      <td width='8%'>&nbsp;</td>
      <td width='5%'>&nbsp;</td>
      <td height=35>
        <b>Grand Total:&nbsp;&nbsp;&nbsp;&nbsp;<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>

1 个答案:

答案 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;
}