收藏!js实现input加减

好的程序员是会复制粘贴的,这样说好像会被唾弃的。。。。。

html

<input type="button" value="-" id="subtraction" onclick="subtraction()"></input>
 <input type="text" value="1" id="number" onBlur="number()"></input>
  <input type="button" value="+" id="add" onclick="add()"></input><br>
  • 减号按钮点击事件
function subtraction(){
            //获取-号按钮
            var subtraction = document.getElementById("subtraction");
            //获取文本框
            var number = document.getElementById("number");
            if (number.value<=1) {
                //如果文本框的值小于1,则设置值为1
                number.value = 1;
            }else {
                number.value = number.value - 1;
            }
        }
  • 文本框离开焦点事件
function number(){
            var number = document.getElementById("number");
            var value = number.value;
            //如果文本值为空,设置为1
            if (value=="") {
                number.value = 1;
            }
            //如果文本值为非纯数字,设置为1
            //isNaN()是否为非法数字
            if (isNaN(value)) {
                number.value = 1;
            }
            //如果文本值小于1,设置为1
            if (parseInt(value)<=1) {
                number.value = 1;
            }
        }

-加号按钮点击事件

function add(){
            var add = document.getElementById("add");
            var number = document.getElementById("number");
            //parseInt() 将数值型字符串转换为数值
            number.value = parseInt(number.value)+1;
        }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容