javaScript简单用户注册应用

最新推荐文章于 2022-09-21 21:03:32 发布

黑暗浪子

最新推荐文章于 2022-09-21 21:03:32 发布

阅读量612

点赞数

分类专栏： javaScript+html5+CSS学习文章标签： javaScript DOM案例

本文链接：https://blog.csdn.net/u012453619/article/details/38143173

版权

javaScript+html5+CSS学习专栏收录该内容

10 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Html study</title>
</head>
<body>
<form action="#">
	<table style="border:none">
    <tr>
    	<td>用户名：</td>
        <td><input type="text" id="username" onBlur="forUserName(this)"></input></td>
        <td style="color:#F00">
        	<label id="user_label" style="display:none">*此用户名已被注册</label>
            <label id="user_label1" style="display:none">*用户名不能为空</label>
        </td>
    </tr>
    <tr>
    	<td>密码：</td>
        <td><input id='pass1' type="password" onBlur="forSafety()"></input></td>
        <td><label id="pass_label" style="color:#F00"></label></td>
    </tr>
    <tr>
    	<td>再次输入：</td>
        <td><input id='pass2' type="password" onKeyUp="forSafety()"></input></td>
    </tr>
    <tr>
    	<td></td>
        <td align="right"><input type="submit" value="注册"></input></td>
        <td></td>
    </tr>
    </table>
</form>
</body>
</html>
<script type="text/javascript">
	function forUserName(node){
		var label1 = document.getElementById('user_label');
		var label2 = document.getElementById('user_label1');
		if(node.value == 'hujie'){
			label1.style.display = '';
		}else{
			label1.style.display = 'none';
		}
		if(node.value == null || node.value == ''){
			label2.style.display = '';
		}else{
			label2.style.display = 'none';
		}
	}
	function forSafety(){
		var passnode1 = document.getElementById('pass1');
		var passnode2 = document.getElementById('pass2');
		var pass1 = new String(passnode1.value);
		var pass2 = passnode2.value;
		var label1 = document.createTextNode('*您的密码过于简单');
		var label2 = document.createTextNode('*两次输入密码不一致');
		var position = document.getElementById('pass_label');
		var child = position.childNodes;
		for(var i=0; i<child.length; i++){
			position.removeChild(child[i]);
		}
		if(pass1.length <= 5){
			position.appendChild(label1);
		}else if(pass1 != pass2){
			position.appendChild(label2);
		}else{
			//加密
			var passstr = '';
			for(var i=0; i<pass1.length;i++){
				for(var j=0; j<i; j++){
					passstr = passstr.concat(pass1.charAt(i-1)+j);
				}
				passstr = passstr.concat(pass1.charAt(i));
			}
			passnode1.value = passstr;
			passnode2.value = passstr;
			alert(passstr);
		}
	}
</script>