效果如下：

代码如下：

！DOCTYPE html html head meta charset=' UTF-8 ' title/title script type=' text/JavaScript ' charset=' utf-8 ' src=' http://cdn。bootcss。com/jquery/3。1 .1/jquery。量滴js '/script/head style # reduce，# add { width: 50px高度： 50px文本对齐：中心；线高： 50pxborder: 1px固体# 000000;font-size : 28px字体粗细：粗体；向左浮动：光标：指针；} # numVal { width: 100px高度： 46px文本对齐：中心；线高： 46px向左浮动：}/style body div id=' reduce '-/div input id=' numVal '/div id=' add '/div/div/body script type=' text/JavaScript ' $(function(){ var setInitVal=20；//设定初始值var setMax=30//设定最大值var设置区间=2；//设定间隔$('#numVal')[0].value=setInitVal$('#reduce ').单击(函数(){ $('#numVal')[0]).值=数字($('#numVal')[0].value)-setInterval；if($('#numVal')[0].值0) { $('#numVal')[0].值=0;} if($('#numVal')[0].value setMax) { $('#numVal')[0].value=setMax} }) $('#add ').单击(函数(){ $('#numVal')[0]).值=数字($('#numVal')[0].值)设置间隔；if($('#numVal')[0].value setMax) { $('#numVal')[0].value=SetMax } if($(' # NumVal ')[0].值0) { $('#numVal')[0].值=0;} }) $('#numVal ').on('blur '，function() { if($('#numVal')[0]).value setMax) { $('#numVal')[0].value=SetMax } if($(' # NumVal ')[0].值0) { $('#numVal')[0].value=Math.abs($('#numVal')[0]).value) } $('#numVal')[0].值=数字($('#numVal')[0].值)if(($('#numVal')[0].value)=' NAn '){ $(' # NumVal ')[0].值=1;} })})/脚本/html以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持我们！