首页 > 代码库 > 所有文本框都不为空时,提交按钮变色

所有文本框都不为空时,提交按钮变色

因为商城项目的需求,自己写了一个小例子。

<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <title></title>    <style>        input {            display: block;            margin: 1em;        }        button {            margin: 1em;            color:#fff;            background:#999;            border:none;        }    </style>    <script src="../library/zepto.all.min.js"></script></head><body><input type="text" class="test" id="test1"/><input type="text" class="test" id="test2"/><input type="text" class="test" id="test3"/><button id="testBtn">button</button><script>    var test1 = document.getElementById(test1);    var test2 = document.getElementById(test2);    var test3 = document.getElementById(test3);    var testBtn = document.getElementById(testBtn);    var flag = false;    var arr = [];    arr.push(test1);    arr.push(test2);    arr.push(test3);    arr.forEach(function (ele) {        ele.addEventListener(blur, function () {            flag = arr.every(function (obj) {                return obj.value !== ‘‘;            });            if(flag){                testBtn.style.backgroundColor = green;            } else {                testBtn.style.backgroundColor = #999;            }        }, false);    });</script></body></html>

 

所有文本框都不为空时,提交按钮变色