好吧讓我們來看Code!~
首先是介面（話說我不知道大小寫英文字母要怎麼講 慘）
<input type="checkbox" id="english_b" checked="checked" />
<label for="english_b">Big english</label>
<input type="checkbox" id="english_l" checked="checked" />
<label for="english_l">Low english</label>
<input type="checkbox" id="number" checked="checked" />
<label for="number">Number</label>
<input type="checkbox" id="other" />
<label for="other">Other signs</label>
<input type="text" id="length" value="10" />
<input type="button" value="Generate" onclick="generate()" />
<input type="text" id="output" />
只有一個入口點，程式結構非常簡單。先是宣告各種集合和變數
var A="ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var a="abcdefghijklmnopqrstuvwxyz";
var num="1234567890";
var other="~`!@#$%^&*()-_+=[{]}\\|;:'\",<.>/?";
var sum="";
var length=document.getElementById("length").value;
var output="";
判斷使用者的勾選狀態並合併集合
if(document.getElementById("english_b").checked)
sum+=A;
if(document.getElementById("english_l").checked)
sum+=a;
if(document.getElementById("number").checked)
sum+=num;
if(document.getElementById("other").checked)
sum+=other;
split，產生N個隨機數，挑選N個隨機元素，合併，output
sum=sum.split('');
while(length--){
var r=Math.floor(Math.random()*sum.length);
output+=sum[r];
}
document.getElementById("output").value=output;
很簡單吧ww
最後附上完整代碼︰
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JavaScript範例 - 密碼產生器</title>
<link type="text/css" rel="stylesheet" href="style.css" />
<script type="text/javascript">
function generate(){
var A="ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var a="abcdefghijklmnopqrstuvwxyz";
var num="1234567890";
var other="~`!@#$%^&*()-_+=[{]}\\|;:'\",<.>/?";
var sum="";
var length=document.getElementById("length").value;
var output="";
if(document.getElementById("english_b").checked)
sum+=A;
if(document.getElementById("english_l").checked)
sum+=a;
if(document.getElementById("number").checked)
sum+=num;
if(document.getElementById("other").checked)
sum+=other;
sum=sum.split('');
while(length--){
var r=Math.floor(Math.random()*sum.length);
output+=sum[r];
}
document.getElementById("output").value=output;
}
</script>
<style type="text/css">
#output{
font-family: Courier New
}
</style>
</head>
<body>
<div id="container">
<a href="home.html">上一頁</a><br />
<h5>Options:</h5>
<input type="checkbox" id="english_b" checked="checked" /><label for="english_b">Big english</label>
<input type="checkbox" id="english_l" checked="checked" /><label for="english_l">Low english</label>
<input type="checkbox" id="number" checked="checked" /><label for="number">Number</label>
<input type="checkbox" id="other" /><label for="other">Other signs</label>
<h5>Length:</h5>
<input type="text" id="length" value="10" /><br />
<input type="button" value="Generate" onclick="generate()" />
<h5>Output:</h5>
<input type="text" id="output" />
</div>
</body>
</html>
你也可以在我的範例網找到︰點我
沒有留言:
張貼留言