jQuery演示三种不同的数字加减插件

收藏

本文将介绍常见的三种使用spinner数字插件来实现数字加减的效果。

0、请不要问“在不在”之类的问题，有问题直接问！1、学生或暂时没有工作的童鞋，整站资源免费下载！2、￥9.9充值终身VIP会员,加我微信，826096331 拉你进VIP群学习！3、程序员加油,技术改变世界。在线 充值

查看演示

加我微信，拉你进VIP群学习：

下载资源 下载积分： 30 积分

演示一：仿京东加减：

<input type="text" class="spinner"/>

$('.spinner').spinner();

演示二：Bootstrap风格，右侧加减

<div class="input-group spinner" data-trigger="spinner" id="spinner"> 
    <input type="text" class="form-control" value="1" data-max="10" data-min="1" data-step="1"> 
    <div class="input-group-addon"> 
        <a href="javascript:;" class="spin-up" data-spin="up"><i class="icon-sort-up"></i></a> 
        <a href="javascript:;" class="spin-down" data-spin="down"><i class="icon-sort-down"></i></a> 
    </div> 
</div>

jQuery ui风格，右侧加减

<input type="text" id="spinner"/>

$("#spinner").spinner({ 
    max:12, 
    min:0, 
    step:3 
})