javascript - jQuery - 增加/减少跨度的值

Question

我有这个:

            <ul class="deposit" style="float:left;list-style-type:none;">
                <a href="javascript:void(0)" id="inc"><li class="first">+</li></a>
                <a href="javascript:void(0)" id="dec"><li class="second">-</li></a>
            </ul>

<div class="left deposit_amount">$<span id="amountSpan"></span></div>

我想这样做，所以每当我单击 #inc 时，#amountSpan 将增加 5。而每当单击 #dec 时，该值将减少 5。我也希望有，所以这个值不能低于0。

目前我有这个:

  $(function(){
    $("#inc").click(function(){
      $("#amountSpan").val( Number($("#amountSpan").val()) + 5 );
    });
    $("#dec").click(function(){
      $("#amountSpan").val( Number($("#amountSpan").val()) - 5 );
    });
  });

但这行不通。我怎样才能得到这个？

提前致谢。

更新:

我试着设置一个最大数量，用这个:

$("#inc").click(function(){
  $("#amountSpan").text( Math.max(20, Number($("#amountSpan").text()) + 5) ) 
});

但它刚刚超过 20。

Answer 1

代替 .val()(用于表单输入元素)，使用 .text()。哦，当你递增时，你需要确保该值首先被强制为一个数字。 (哦等等你已经是:-)

$(function(){
    $("#inc").click(function(){
      $("#amountSpan").text( Number($("#amountSpan").text()) + 5 );
    });
    $("#dec").click(function(){
      $("#amountSpan").text( Number($("#amountSpan").text()) - 5 );
    });
  });

要保持金额大于或等于零:

    $("#amountSpan").text( Math.max(0, Number($("#amountSpan").text()) - 5) )