仅计算当前字段未更改的字段

时间:2015-04-29 10:41:20

标签: javascript html forms

我尝试了几件事,但似乎无法做到这一点!我有以下文档(代码将遵循),自动计算并添加字段以添加更多数量。但是如果更改qty_1(手动),并添加了另一个计算,则"更改了qty_1"恢复到第一个计算值。我希望保留更改的值。

文件:

<script>
function calculate(){
    for(var i=1; i<=ct; i++){
        var currentDiv = document.getElementById(i);
        var ori_qty = currentDiv.getElementsByTagName('input')[0].value;
        var total = Math.round(ori_qty/0.8);
        currentDiv.getElementsByTagName('input')[1].value = total;
        currentDiv.getElementsByTagName('input')[2].value = total;
    };
}

var ct = 1;
function new_combi(){
    ct++;
    var div1 = document.createElement('div');
    div1.id = ct;
    // link to delete extended form elements
    var delLink = '<div style="text-align:right;margin-right:65px"><a href="javascript:delIt('+ ct +')">Delete</a></div>';
    div1.innerHTML = document.getElementById('var_roo_fields').innerHTML + delLink;
    document.getElementById('addCom').appendChild(div1);
}

function delIt(eleId){
    d = document;
    var ele = d.getElementById(eleId);
    var parentEle = d.getElementById('addCom');
    parentEle.removeChild(ele);
}
</script>

<form id="form1" name="form1" method="post" action="">
    <div id="addCom" style="width:100%">
        <div id="1">
        <table class='table1' width="100%" border="0" cellpadding="0" cellspacing="2">
        <tr>
        <td width="25%" valign="top">Original Quantity</td>
        <td width="27%" valign="top"><input type="text" name="ori_qty[]" onBlur="calculate()" /></td>
        <td width="24%" valign="top">&nbsp;</td>
        <td width="24%" valign="top">&nbsp;</td>
        </tr>
        <tr>
        <td valign="top">Quantity 1</td>
        <td valign="top"><input type="text" name="qty_1[]" id="qty_1[]" />
        </td>
        <td valign="top">Quantity 2</td>
        <td valign="top"><input type="text" name="qty_2[]" id="qty_2[]" /></td>
        </tr>
        </table>
        </div>
    </div>
<a href="javascript:new_combi()">Add Calculation</a>
</form>

<!-- REPEAT FIELDS -->
<div id="var_roo_fields" style="display:none">
<div>
<hr />
<table class='table1' width="100%" border="0" cellpadding="0" cellspacing="2">
    <tr>
    <td width="25%" valign="top">Original Quantity</td>
    <td width="27%" valign="top"><input type="text" name="ori_qty[]" onBlur="calculate()" /></td>
    <td width="24%" valign="top">&nbsp;</td>
    <td width="24%" valign="top">&nbsp;</td>
    </tr>
    <tr>
    <td valign="top">Quantity 1</td>
    <td valign="top"><input type="text" name="qty_1[]" id="qty_1[]" />
    </td>
    <td valign="top">Quantity 2</td>
    <td valign="top"><input type="text" name="qty_2[]" id="qty_2[]" /></td>
    </tr>
</table>
</div>
</div>

所以我想要的是计算的原始金额 - 并手动更改 - 在添加另一个计算后保持不变。

这里有小提琴:https://jsfiddle.net/y8une7ub/

0 个答案:

没有答案