简易密码生成器-HTML

简易密码生成器-HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>PassGenerator</title>
	<style type="text/css">
	.passgen {
		border: 1px solid #9370DB;
		background: #CAE1FF;
		font-size: 20px;
	}
	#error {
		color: red;
	}
	</style>
	<script type="text/javascript">
		function rnd() {
			return Math.random();
		}
		function generate() {
			var length = parseInt(document.getElementsByName("length")[0].value);
			var num = document.getElementById("num");
			var lowChar = document.getElementById("lowChar");
			var upChar = document.getElementById("upChar");
			var special = document.getElementById("special");
			var result = document.getElementById("result");
			var keys = "";
			var error = document.getElementById('error');
			error.innerHTML = "";
			if(num.checked == true) {
				keys += "0123456789";
			}
			if(lowChar.checked == true) {
				keys += "abcdefghijklmnopqrstuvwxyz";
			}
			if(upChar.checked == true) {
				keys += "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
			}
			if(special.checked == true) {
				keys += "!@#$%^&*";
			}
			if(!isNaN(length)) {
				var r = "";
				for(var i = 0; i < length; i++) {
					var index = (Math.round(rnd() * Math.pow(10, length))) % keys.length;
					r += keys.charAt(index);
				}
				result.value = r;
			} else {
				error.innerHTML = '请输入密码长度,且必须是数字开头';
			}
		}
	</script>
</head>
<body>
    <div>
		<table class="passgen">
			<caption>密码生成器</caption>
			<tr>
				<td>长度:</td>
				<td>
					<input type="text" name="length" size="5" value="10"/>
					<span id="error"></span>
				</td>
			</tr>
			<tr>
				<td>类型:</td>
				<td>
					<input id="num" type="checkbox" checked="true"/>数字
					<input id="lowChar" type="checkbox" checked="true"/>小写字母
					<input id="upChar" type="checkbox" checked="true"/>大写字母
					<input id="special" type="checkbox"/>特殊字符
				</td>
			</tr>
			<tr>
				<td><input type="button" value="生成" onclick="generate()"/></td>
				<td><input id="result" type="text" size="50"/></td>
			</tr>
		</table>
    </div>
</body>
</html>

你可能感兴趣的:(generator,password)