【发布时间】：2018-01-23 10:56:26
【问题描述】：
我在我的数量输入前后添加了一个加号和减号按钮，这很有效，问题是当数量更新时，它不会更新价格/总价，除非我点击进入然后退出输入框。如何在不点击输入框的情况下获取要更新的数量？系统已经有代码可以在数量发生变化时更新价格，但是当我使用加号或减号按钮时，它不会读取正在更改的值，只有在我单击框后。
$('input#w3934_txtQantity').before("<input type='button' value='-' class='qtyminus' field='w3934_txtQantity' />");
$('input#w3934_txtQantity').after("<input type='button' value='+' class='qtyplus' field='w3934_txtQantity' />");
$('.qtyplus').click(function(e){
e.preventDefault();
fieldName = $(this).attr('field');
var currentVal = parseInt($('#w3934_txtQantity').val());
if (!isNaN(currentVal)) {
$('#w3934_txtQantity').val(currentVal + 10);
} else {
$('#w3934_txtQantity').val(0);
}
});
$(".qtyminus").click(function(e) {
e.preventDefault();
fieldName = $(this).attr('field');
var currentVal = parseInt($('#w3934_txtQantity').val());
if (!isNaN(currentVal) && currentVal > 0) {
$('#w3934_txtQantity').val(currentVal - 10);
} else {
$('#w3934_txtQantity').val(0);
}
});
$('#w3934_txtQantity').trigger('change');input {
width: 40px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><table cellspacing="0" border="0" style="width:100%;height:100%;padding-top:5px;">
<tr>
<td valign="bottom"><span id="w3934_lblQuantity" style="white-space:nowrap;">Quantity</span></td><td valign="bottom"><span id="w3934_lblUnitPrice" style="white-space:nowrap;">Unit Price</span></td>
<td><span id="w3934_lblAddlCharges" style="display:inline-block;width:110px;">Setup</span></td>
<td valign="bottom"><span id="w3934_lblShip">Shipping</span></td><td valign="bottom" style="text-align:right;"><span id="w3934_lblSubTotal" style="white-space:nowrap;">Subtotal</span></td></tr>
<tr>
<td class="SubTotalLine"><input name="w3934$txtQantity" type="text" value="170" id="w3934_txtQantity" class="medText formField" style="text-align:right;" /></td>
<td class="SubTotalLine"><input name="w3934$txtUnitPrice" type="text" value="$2.00" readonly="readonly" id="w3934_txtUnitPrice" class="medText formField DisplayTextBox" style="margin-top:5px;text-align:center;" /></td>
<td class="SubTotalLine"><input name="w3934$txtAddlCharges" type="text" value="$55.00" readonly="readonly" id="w3934_txtAddlCharges" class="medText formField DisplayTextBox" style="margin-top:5px;text-align:center;" /></td>
<td class="SubTotalLine"><input name="w3934$txtShip" type="text" readonly="readonly" id="w3934_txtShip" class="medText formField DisplayTextBox" style="margin-top:5px;text-align:center;" /></td>
<td class="SubTotalLine" align="right"><input name="w3934$txtSubTotal" type="text" value="$395.00" readonly="readonly" id="w3934_txtSubTotal" class="medText formField DisplayTextBox" style="margin-top:5px;" /></td>
</tr>
</table>【问题讨论】：
-
您没有添加任何更新总数的代码。
-
change就是这样做的，它会在发生变化时触发，即当焦点离开时。如果您想要“实时”更新，您可以将change替换为input -
@adeneo 你所说的“实时”更新是什么意思？
-
我的意思是，如果您希望在用户更改值而不失去焦点时触发事件，您可以使用
input事件。您似乎在某些可能会更新值的东西上有点击事件，并且您还必须在点击时触发change事件。 -
所以不是点击我会使用输入？ ...我想我开始迷惑自己了。