点击显示乘法到具有不同 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> &nbsp;<input type="text" name ="f03" value="#BUY#" Style="border:none; border-bottom:1px solid #a0a6af;" id ="BUY" ></td>
        <td></td><td>&nbsp;  &nbsp;  &nbsp;</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> &nbsp;<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> &nbsp;<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">&nbsp; &nbsp; &nbsp; ₹ </span>&nbsp; <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 的输入字段的主要内容,如果未能解决你的问题,请参考以下文章

图像在 OPENCV 中具有不同模型的 2 个图像的乘法

如何让组合框选择与 ExtJS6 中显示的值不同的值?

将 json 字段绑定到 POJO 中具有不同名称的字段的注解

创建具有不同列名的 Rails 关联

尽管 for=id,单击标签不会集中输入

如何设置一个按钮以显示弹出窗口的不同结果? (JavaFX)