ajax方式表单拦截

最新推荐文章于 2022-07-24 21:23:56 发布

weixin_30216561

最新推荐文章于 2022-07-24 21:23:56 发布

阅读量69

点赞数

原文链接：http://www.cnblogs.com/bruce-gou/p/5226184.html

版权

html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
</head>
<body>
    <form method="post" action="http://www.baidu.com" οnsubmit="return check()" >
        姓名:<input type="text" name="uName" id="uName" οnblur="checkName();"><span class="message"></span><br/>
        密码:<input type="password" name="uPwd" id="uPwd" οnblur="checkPwd()"><span class="message" ></span><br/>
        <input type="submit" value="登录">
    </form>
<script type="text/javascript" src="login.js"></script>
</body>
</html>

function checkName(){
    var uName=document.getElementById("uName")
    var name=uName.value;
    var message=uName.nextSibling;
    if(name.length==0){
        message.innerHTML="用户名不能为空"
    // this.focus();
        return false;
    }else if (name.length<4||name.length>10){
        message.innerHTML="用户名长度为4-10位之间"
        return false;
    }else{
        message.innerHTML="用户名输入正确"
        return true;
    }
}

function checkPwd(){
    var uPwd=document.getElementById("uPwd");
    var pwd=uPwd.value;
    var message=uPwd.nextSibling;
    if(pwd.length==0){
        message.innerText="用户密码不能为空"
        return false;
    }else{
        message.innerText="用户密码输入正确"
        return true;
    }
}

function check(){
　　if(checkName()&&checkPwd()){
　　　　//发送ajax   //操作成功后 返回true  否则返回false
　}
}

可以通过check这个函数的返回结果控制表单的跳转，为true 才跳转

转载于:https://www.cnblogs.com/bruce-gou/p/5226184.html

weixin_30216561

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ajax方式表单拦截

html<!DOCTYPE html><html><head> <title></title> <meta charset="utf-8"></head><body> <form method="post" action="http://www...
复制链接

扫一扫