使用JavaScript从另一个字段添加更多值

需要帮助来解决JavaScript问题。 我正在处理一张发票，希望在其中向“数量”字段添加更多值。 我正在尝试使用JSFIDLE中给出的脚本

问题是当我点击编辑时，它会弹出一个对话框，通过在添加字段中输入数据，它会被添加到特定项目的当前数量中

JS脚本

$(document).on('change', '.addQty', function () {
  id_arr = $(this).attr('id');
id = id_arr.split("_");
add = $('#add_'+id[1]).val();
qty = $('#quantity_'+id[1]).val();
if (add != '' && typeof (add) != "undefined") {
  $('#add_'+id[1]).val();
  added = parseFloat(qty) + parseFloat(add);
  $('#qtY_'+id[1]).val(added);
  priceAfter = $('#price_'+id[1]).val();
  $('#Total_'+id[1]).val((parseFloat(priceAfter) * parseFloat(added)).toFixed(2));

} else {
  $('#quantity_'+id[1]).val(qty);
  $('#Total_'+id[1]).val((parseFloat(price) * parseFloat(qty)).toFixed(2));
}

---

}))

我对它进行了编辑，但它不起作用，当然是因为php值不起作用。我为编辑按钮添加了id，并从对话框中获取值。根据按钮id，您可以在相应的数量字段中输入值

<button type="button" id="edit_<?php $i; ?>" class="editnow"> Edit </button>

Yes: function () {
        var id = $(this).attr('id');
        id = id.substring(id.indexOf('_')+1);
        alert($('#quantityVal').val()); // just check the value
        $('#quantity_'+id).val($('#quantityVal').val());
        $(this).dialog("close");    
    },

---

我通过执行以下操作使其正常工作：


向编辑按钮添加id，以便我们可以检索当前正在编辑的行的id
将“onchange”函数替换为addQuantity函数，该函数接受一个参数：正在编辑的行的id
修复了代码中用于计算新数量和新价格的ID的几个问题

另外，我用硬编码的ID替换了php代码。你得把它们换掉

编辑：因为您不想在对话框中显示当前数量，所以我必须更改逻辑并在单击“关闭”后更新表格。否则会引起太多问题。希望你喜欢


$（文档）.ready（函数（）{
calculateEachItemSubCost（）；
});
函数calculateEachItemSubCost（）{
var qtys=document.getElementsByClassName（'quantity'）；
var price=document.getElementsByClassName（'price'）；
var item_costs=document.getElementsByClassName（'totalineprice'）；
对于（var i=0；i<项目成本.length；++i）{
物料成本[i].value=parseFloat（数量[i].value）*parseFloat（价格[i].value）.toFixed（2）；
}
}
/*替换“onchange”侦听器的新函数。它处理在给定行上添加由id参数标识的数量*/
函数addQuantity（id）{
var add，add，priceAfter；
add=$（'#addedQuantity'）.val（）；
console.log（“添加”+add+“在线”+id）；
如果（添加！=''&&typeof添加！=“未定义”）{
;
added=parseInt（$（'.add'）.val（））+parseInt（$（'.'数量'+id）.val（））
$（'#数量'+id）.val（已添加）；
priceAfter=$（'#price"+id）.val（）；
$（'#total_'+id）.val（（parseFloat（priceAfter）*parseFloat（added））.toFixed（2））；
}否则{
$（数量+id）.val（数量）；
$（'#Total.'+id）.val（（parseFloat（price）*parseFloat（qty））.toFixed（2））；
}
}
$（文档）.on（'单击'，'.editnow'，函数（事件）{
变量lineId，quantityField；
//正在检索单击的行的id
lineId=event.target.id.split（“”）[1]；
quantityField=$（“#数量"+lineId）；
$（“.add”）.val（“”）；
$（“#编辑”）。对话框({
显示：“折叠”，
隐藏：“折叠”，
莫代尔：是的，
标题：“编辑”，
zIndex:10000，
关闭：功能（事件、用户界面）{
添加数量（lineId）；
$（this.hide（）；
}
});
});
#编辑{
显示：无；
}

发票联
项目名称
价格
量
全部的
编辑
编辑
编辑
添加
谢谢您的回答。但它仍然不工作。警报未定义。它工作正常，但我不希望它在“是”按钮上，因为我正在添加1另一个字段也用于减法。当我点击编辑另一个项目时，它应该只显示该项目的新增数量。我不明白。“是”和“否”按钮应该做什么。如果您有问题，他们只会关闭对话框。您希望何时添加数量并计算价格？请通过编辑您的问题来回答。我已更新了JSFIDLE。我已通过替换“关闭”删除了“是”和“否”按钮。因为我只想用此按钮关闭对话框。当我单击“编辑”按钮时，它应仅显示以前添加的值，如果未编辑，则应显示空文本字段，而不是显示另一个已编辑项的值。因为我正在将编辑过的值插入到数据库的一个单独的列中。@或者，我看不到被替换的JSFIDLE。不管怎样，我想我明白了。请参阅我的编辑。这就是你想要的吗？抱歉，现在它已经更新了，你更新的小提琴只显示当前的QTY。
<td><input type="number" class="add" id="quantityVal"></td>