php或JS 表单监听 自动提交

有这么一个需求:1.一个HTML页面的表单有6个输入框2.当6个输入框都输入信息之后,而且信息判定正确,表单自动提交返回OK这怎么效果怎么实现?... 有这么一个需求:
1.一个HTML 页面的表单有6个输入框
2.当6个输入框都输入信息之后,而且信息判定正确,表单自动提交返回OK
这怎么效果怎么实现?
展开
 我来答
百度网友2a546d3
2017-05-10 · TA获得超过157个赞
知道小有建树答主
回答量:115
采纳率:78%
帮助的人:76.5万
展开全部
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<input class="input" name="input1" value="">
<input class="input" name="input2" value="">
<input class="input" name="input3" value="">
<input class="input" name="input4" value="">
<input class="input" name="input5" value="">
<input class="input" name="input6" value="">
</body>
<script>
    (function(){
        var inputs = document.getElementsByClassName('input'),
                i = 0,
                n;
        //给每个input绑定一个change事件,每个change事件再绑定一个submit方法
        while (n = inputs[i]){
            n.addEventListener('change', submit, false);
            i++;
        }
        //检查是否已经都输入了结构,都返回了后执行Ajax异步提交表单到'

        function submit(){
            var checkVal = checkValue();
            if(!checkVal) return false;
            var xhr = new XMLHttpRequest(),
                    formData = new FormData();    //H5form表单API
            for(var i = 0; i < checkVal.length; i++){
                formData.append('input' + i, checkVal[i]);
            }
            xhr.onload = function(){
                //相应结果
                var response = xhr.responseText;
            };
            xhr.open('POST', 'http://localhost');
            xhr.send(formData);
        }
        //判断搜索输入框是否都输入了值,没有就返回false,有就返回结果数组
        function checkValue(){
            var valArr = [];
            for(var i = 0; i < inputs.length; i++){
                var val = inputs[i].value;
                if(typeof val === 'string' && val != ''){
                    valArr.push(val);
                }else{
                    return false;
                }
            }
            return valArr;
        }
    }());
</script>
</html>
Le丶Holmes
2017-05-10 · 超过38用户采纳过TA的回答
知道小有建树答主
回答量:80
采纳率:75%
帮助的人:27万
展开全部
我有个笨办法,就是当光标每次离开输入框的时候都判断每个输入框是否有值,如果都有,就提交。
function check(){
var from = document.getElementById("from");
var a1 = document.getElementById('a1').value;
var a2 = document.getElementById('a2').value;
var a3 = document.getElementById('a3').value;
var a4 = document.getElementById('a4').value;
var a5 = document.getElementById('a5').value;
var a6 = document.getElementById('a6').value;
if(a1=='' ||a2=='' || a3=='' || a4=='' || a5=='' || a6==''){
return false;
}else{
from.submit();
}
}
<form id="from" name="from" action="" method="post">
<input id="a1" type="text" onBlur="check();">
<input id="a2" type="text" onBlur="check();">

<input id="a3" type="text" onBlur="check();">

<input id="a4" type="text" onBlur="check();">

<input id="a5" type="text" onBlur="check();">
<input id="a6" type="text" onBlur="check();">
</from>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2017-05-10
展开全部
好难啊,我也不会
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式