<html>
<head>
</head>
<Title>Password Regex</Title>
<body id="body">
<form action="javascript:void(0);" id="exampleForm">
Password:<input type="password" id="examplePass" name="Enter password" />
<input type="submit" />
</form>
</body>
<script language="javascript">
document.getElementById("exampleForm").onsubmit = function(){
var passwordRegex = /^[A-Za-z\d]{6,}$/;
if(!passwordRegex.test(document.getElementById("examplePass").value)){
console.log("Regex didn't match");
var notify = document.getElementById("notify");
if(notify === null){
notify = document.createElement("p");
notify.textContent = "Passwords need to above 6 words!";
notify.id = "notify";
var body = document.getElementById("body");
body.appendChild(notify);
}
}
};
</script>
</html>
Sol of lab7 condition：/^[A-Za-z\d]{6,}$/
(至少要一大寫英或小寫英或數字、超過6字)
Sol of lab9 condition：/^(?=.*\d)(?=.*[\W_]).{6,}$/
(至少一數字、一特殊字元、超過6字，大小寫英可有可無)
"\W"為不包含大小寫A-Z和0~9和"_"
"\w"則剛好和\W完全相反
所以取特殊字元必須使用大寫"\W"(此時底線除外)
最後把底線加入："[\W_]"
第二版程式碼：
<html>
<head>
</head>
<TITLE>exam the password</TITLE>
<body id="body">
<form method="POST" action="form-handler.php" onsubmit="return checkForm(this);">
<p>Username: <input type="text" name="username"></p>
<p>Password: <input type="password" name="pwd1"></p>
<p>Confirm Password: <input type="password" name="pwd2"></p>
<p><input type="submit"></p>
</form>
</body>
<script type="text/javascript">
function checkPassword(str)
{
var re = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*\W).{6,}$/;
// /^[A-Za-z\d]{6,}$/至少要一大寫英或小寫英或數字、超過6字
// /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*\W).{6,}$/ 至少一數字、一小寫英、一大寫英、一特殊字、超過6字
return re.test(str);
}
function checkForm(form)
{
if(form.username.value == "") {
alert("Error: Username cannot be blank!");
form.username.focus();
return false;
}
re = /^\w+$/;
if(!re.test(form.username.value)) {
alert("Error: Username must contain only letters, numbers and underscores!");
form.username.focus();
return false;
}
if(form.pwd1.value != "" && form.pwd1.value == form.pwd2.value) {
if(!checkPassword(form.pwd1.value)) {
alert("The password you have entered is not valid!");
form.pwd1.focus();
return false;
}
} else {
alert("Error: Please check that you've entered and confirmed your password!");
form.pwd1.focus();
return false;
}
return true;
}
</script>
</html>
參考資料：1、2、3、4、5、6
