Question

嘿伙计我还是js和JQuery的新手，所以我真的需要一些帮助。我已经尝试了几种方法来做到这一点。当用户单击加号按钮时，我基本上需要将文本框的值增加1，并在单击减号按钮时减少1。我还没有为减号编码，因为我没有想到加号。我的$（＆＃39;＃itemQuant1＆＃39;）。val（+1）;呼叫工作，但停在1.这是我的js：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">       </script>

<script>
$(document).ready(function(){
    var current_count = $('#itemQuant1').val();
    var plus_count = current_count + 1;
    var minus_count = current_count - 1;
    //var minusCount = document.getElementById('minusItem').value; 

    $("#plusItem1").on('click', function(){

         current_button = $(this);

        if (current_button.attr('id') == "plusItem1")
        {
            $('#itemQuant1').val(+1);
            //current_count.val() + plus_count;
            //plus_count.val() + 1;
            //$('#itemQuant1').value = current_count.value + 1;

        }

    });

    });
</script>

这是html：

<body>
<div>
    <table style= "border:solid;border-width:thin;">
        <tr>
            <td style= "border:solid;border-width:thin;"><p><input       class"comfirmItem" type="checkbox">1-FLUE CONNECTOR ASSEMBLY PACKAGE (0005812) +$665.10<button id="plusItem1" class="more_Item" style="float:right;">+</button><button id="minusItem" class="less_Item" style="float:right;">-</button><input id="itemQuant1" class"itemCount" type="textbox" value=0 style="width:30px;text-align:center;margin-left:5px;margin-right:5px;float:right;"></p></td>
        </tr> 
        <tr>
     <td style= "border:solid;border-width:thin;"><p><input class"comfirmItem" type="checkbox">2-DUCT BOX ASSEMBLY (0005875) +$305.01<button id="plusItem" class="more_Item" style="float:right;">+</button><button id="minusItem" class="less_Item" style="float:right;">-</button><input id="itemQuant2" class"itemCount" type="textbox" style="width:30px;text-align:center;margin-left:5px;margin-right:5px;float:right;"></p></td>
        </tr>
    </table>
</div>
</body>
</html>

Answer 1

您只需要执行此操作 - http://jsfiddle.net/jayblanchard/rCM5d/

 $('#itemQuant1').val( parseInt($('#itemQuant1').val()) + 1);

Answer 2

对于向上和向下按钮，可能会将所有按钮逻辑包装在一起，如下所示：http://jsbin.com/kikitule/1/edit

您的HTML将如下所示：

<button class="items-button" data-sum="1" data-target="#itemQuant1">+</button>
<button class="items-button" data-sum="-1" data-target="#itemQuant1">-</button>
<input id="itemQuant1" class="itemCount" type="textbox" value=0>

和JQuery一样：

$(document).ready(function(){

  $(".items-button").on('click', function(){
    var $button = $(this);
    var $quantity = $($button.attr('data-target'));
    var sum = parseInt($button.attr('data-sum'), 10);
    var total = parseInt($quantity.val(), 10) + sum;

    if (total < 0) {
      total = 0;
    }

    $quantity.val(total)
  });

});

我的JS / JQuery不会更新我的文本字段值

2 个答案: