防止JS点击计数器中的负数

时间:2013-01-17 18:37:55

标签: javascript jquery

我有一个简单的JS计数器,带有两个按钮(+和 - ),用于统计人。工作正常,但它允许用户在减少计数时进入否定状态。可能是一个简单的解决方案,但不适合我。任何帮助,将不胜感激。感谢。

JS

    //Pax Counter

$(document).ready(function(){
    //Count Function
    $('#increase').click(function() {
    $('#pax_count').val(function(i, val) { return val*1+1 });
});
    $('#decrease').click(function() {
    $('#pax_count').val(function(i, val) { return val*1-1 });
}); 

  });

HTML

<input name="pax_count" type="text" class="pax_input_box" id="pax_count" value="0" >

<div id="pax_counter_container"><!-- open #pax_counter_container -->
<button id="increase" type="button" class="click_button" onTouchStart="EvalSound('audio3')"></button>
<button id="decrease" type="button" class="click_button" onTouchStart="EvalSound('audio3')"></button>
</div><!-- close #pax_counter_container -->

3 个答案:

答案 0 :(得分:5)

您可以使用Math.max()

$("#pax_count").val(function(i, val) {
    return Math.max(0, val - 1);
});

答案 1 :(得分:1)

我只是修改了你的函数来检查并在减去之前查看该值是否大于或等于0.

$(document).ready(function(){
    //Count Function
    $('#increase').click(function() {
    $('#pax_count').val(function(i, val) { return val*1+1 });
});
    $('#decrease').click(function() {
    $('#pax_count').val(function(i, val) { 
         if(val*1>0){
             return val*1-1;
         }else{
             return val;
         }
}); 

});

答案 2 :(得分:1)

只需检查值是否小于1

$('#decrease').click(function() {
    $('#pax_count').val(function(i, val) { return val>=1?val*1-1:0 });
});