js做简单的登录页面以及附加条件，登录成功后跳转-Toy模板网

这篇具有很好参考价值的文章主要介绍了js做简单的登录页面以及附加条件，登录成功后跳转。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

新手第一次上传，还不会介绍，很简单，能看懂不难的

<!doctype html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>制作注册验证</title>
	<link href="css/reg.css" rel="stylesheet">
</head>

<body>
	<div class="main"><img src="images/top.jpg" alt="top" />
		<form  method="post" id="myform" action="success.html">
			<dl>
				<dt class="left">用户名：</dt>
				<dd><input id="user" type="text" class="inputs" onblur="checkUser()" onfocus="showUser()" />
					<div id="user_prompt" class="prompt"></div>
				</dd>
			</dl>
			<dl>
				<dt class="left">密码：</dt>
				<dd><input id="pwd" type="password" class="inputs" onblur="checkPwd()" onfocus="showPwd()" />
					<div id="pwd_prompt" class="prompt"></div>
				</dd>
			</dl>
			<dl>
				<dt class="left">&nbsp;</dt>
				<dd><input name="" type="image" src="images/sumbit_btn.jpg" /></dd>
			</dl>
		</form>
	</div>
<script src="js/jquery-1.12.4.js"></script>
<script>
	$(document).ready(function(){
		$("#myform").submit(function(){
	var flag = true;
				if (!checkuser()) flag = false;
				if (!checkpwd()) flag = false;
                return flag;
})
            $("#fuser").blur(checkuser);
			$("#pwd").blur(checpwd);
			
	})

			function checkuser() {
			var $user = $("#user");
			var $divID = $("#user_prompt");
			$divID.html("");
			if ($user.val() == "") {
				$divID.html("名字不能为空");
				return false;
			}
			for (var i = 0; i < $user.val().length; i++) {
				var j = $user.val().substring(i, i + 1)
				if (j >= 0) {
					$divID.html("姓名中不能包含数字");
					return false;
				}
			}
			return true;
		}
		function checkpwd() {
			var $pwd = $("#pwd");
			var $divID = $("#pwd_prompt");
			$divID.html("");
			if ($pwd.val() == "") {
				$divID.html("密码不能为空");
				return false;
			}
			if ($pwd.val().length < 6) {
				$divID.html("密码必须等于或大于6个字符");
				return false;
			}
			return true;
		}
</script>
</body>

</html>

js做简单的登录页面以及附加条件，登录成功后跳转

文章来源地址https://www.toymoban.com/news/detail-515052.html

成功后跳转页面代码就更简单了

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=deng, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    登录成功！
</body>

</html>

js做简单的登录页面以及附加条件，登录成功后跳转