点击显示乘法到具有不同 ID 的输入字段
Posted
技术标签:
【中文标题】点击显示乘法到具有不同 ID 的输入字段【英文标题】:Multiplication on click show into input filed with Different ID 【发布时间】:2018-03-01 02:50:27 【问题描述】:我正在设计购物车功能。并且在 jQuery 中更新鲜我的布局是
这是我的设计
我想在单击增量和减量按钮时将增量值和减量值乘以输入字段值下面是我的 jQuery 代码
$('.increment-btn').on('click',function()
var $counter=$(this).closest('td').find('.counter');
var currentVal = parseInt($counter.val());
if (!isNaN(currentVal) && currentVal > 0)
$counter.val(currentVal - 1);
);
这是 html 代码
<table Style="width:100%;" class="sumtable">
<tr>
<td id="info" Style="padding-left: 3%;width: 20%; ">Buy Price</td>
<td > <span id="RS" style="color:#4286f4">₹</span> <input type="text" name ="f03" value="#BUY#" Style="border:none; border-bottom:1px solid #a0a6af;" id ="BUY" ></td>
<td></td><td> </td>
<!--td ><input type="checkbox" name="vehicle" id="#c001#"></td-->
<td>#CHECK#</td>
</tr>
<tr>
<td id="info" Style="padding-left: 3%; ">MRP Price</td>
<td> <span id="RS" style="color:#4286f4">₹</span> <input name="num1" type="text" value ="#MRP#" Style="border:none; border-bottom:1px solid #a0a6af;" id ="MRP_#PRODUCTID#" class="CLASS_MRP" /></td>
</tr>
<tr>
<td id="info" Style="padding-left: 3%;">Sell Price</td>
<td> <span id="RS" style="color:#4286f4">₹</span> <input name="num2" type="text" value="#SELL#" Style="border:none; border-bottom:1px solid #a0a6af;" ID="SELL_#PRODUCTID#" class="CLASS_SELL" /></td>
</tr>
</table>
</div><br>
<div Style="float:right;">
<table Style="width:100%; float:right; line-height: 2;" >
<tr>
<td style="text-align:right;">Your Profit</td>
<td><span id="RS" style="color:#4286f4"> ₹ </span> <input name="num3" type="text" type="hidden" value="1" Style="border:none; border-bottom:1px solid #a0a6af; color:#2d992f; font-weight:700; text-align:center; " id="OUT_#PRODUCTID#" class="CLASS_OUT" > <span id="liveResult"></span> </td>
</tr>
<tr>
<td style="text-align:right;" id ="minimum">Minimum Quantity</td>
<td style="text-align:center;"><input type="button" value="-" style="width: 30px;border-radius: 50%; background-color: white;height: 30px; border: 1px solid #0953A3;" class="decrement-btn">
<input id="AAA" type="text" Style="border:none; border-bottom:1px solid #a0a6af;text-align: center;" value="1" class="counter" >
<input type="button" value="+" style="width: 30px;border-radius: 50%; background-color: white;height: 30px; border: 1px solid #0953A3;" class="increment-btn">
</td>
<td>
$(function ()
$('.increment-btn').on('click',function()
var $counter=$(this).closest('td').find('.counter');
var currentVal = parseInt($counter.val());
var total = 0;
if (!isNaN(currentVal))
$counter.val(currentVal + 1);
);
$('.decrement-btn').on('click',function()
var $counter=$(this).closest('td').find('.counter');
var currentVal = parseInt($counter.val());
if (!isNaN(currentVal) && currentVal > 0)
$counter.val(currentVal - 1);
);
);
这是一个功能,我只使用它的工作增量和减量数字,但我希望在单击增量按钮时增量值乘以输入字段值
【问题讨论】:
你应该发布使用上述函数的整个代码。 请移除 angularjs 标签,因为这不是 angularjs 【参考方案1】:你可以试试:
这里我管理用户不能在文本框中输入负数,和用户不能填写超过99999。
$(function()
$(".but").on("click",function()
var id=this.id;;
var inc=id=="inc";
var d = $("#input_data");
var val = +d.val();
if (inc)val++;else val--;
d.val(val);
);
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" id="dec" class="but"> - </button>
<input type="number" id="input_data" value="1" max-length="999999" min-length="0">
<button type="button" id="inc" class="but"> + </button>
【讨论】:
【参考方案2】:试试这个可能对你有帮助
$(function()
$(".but").on("click",function()
var id=this.id;;
var inc=id=="inc";
var d = $("#input_data");
var val = +d.val();
if (inc)val++;else val--;
d.val(val);
);
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" id="dec"> - </button>
<input type="number" id="input_data" value="1">
<button type="button" id="inc"> + </button>
【讨论】:
它允许负数并取 3498374723497927347242, @man以上是关于点击显示乘法到具有不同 ID 的输入字段的主要内容,如果未能解决你的问题,请参考以下文章