微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery Spinner类型的东西

我今天早些时候试图创建一个jQuery Spinner类型的东西,有人给了我这段代码,它增加了单击按钮时文本字段的值.太棒了但是,如果值是0-0,您将如何禁用.desc按钮.在PHP中,如果< = 0则很容易,以此类推...但是我不知道jQuery. 还有任何想法如何将其用于上/下无序html列表(即ul li)的上移?

$(document).ready(function() 
{   
    $(function()
    {
        $(".inc").click(function() 
        { 
            $(":text[name='qty']").val(Number($(":text[name='qty']").val()) + 1);
        }); 

        $(".dec").click(function()
        {      
            $(":text[name='qty']").val(Number($(":text[name='qty']").val()) - 1);
        });  
    });
});

这使用一种形式:

<input type="text" name="qty" value="0" />
<img src="img/up.png" class="inc" width="20px" height="9px" alt="Increase" title="increase" />
<img src="img/down.png" class="dec" width="20px" height="9px" alt="Decrease" title="Decrease" />
最佳答案
这是我的代码,

$(document).ready(function () {
  var textElem = $(":text[name='qty']"),getTextVal = function() {
        var val = parseInt(textElem.val(),10);
        return isNaN(val) ? 0 : val;
      };

  $(".inc").click(function () {
      textElem.val(getTextVal() + 1);
  });

  $(".dec").click(function(){
      if( getTextVal() == 0) {
         return false;
      }

      textElem.val(getTextVal() - 1);
  });
});

当文本元素的值达到0时,图像’.dec’停止递减,您可以动态地在图像中添加删除类名,以便用户可以注意到过渡.

建议为此使用按钮,并且可以使用CSS设置按钮的样式以根据需要显示.

这不是经过优化的代码,但是应该使您了解如何使其按照您的要求工作.

原文地址:https://www.jb51.cc/jquery/530951.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐