私にはクラックするナッツがあり、それはしばらくの間私の頭をクラックします。
私はプログラミング初心者です、それは紹介用です。入力フィールドをチェックし、いくつかの基準に一致する場合は、ログインボタンの属性を設定解除するJSフォーム検証を実現しようとしてemail
いpassword
ます"disabled"
。
私は自分の JS コードのコンポーネントを試してみましたが、問題なく動作しますがvalidate()
、それを function にマージすると、うまくいかず、理由が見つかりません。
ここに私のHTMLがあります:
<!DOCTYPE html>
<head>
<meta charset='UTF-8' />
<title>$title</title>
<link href='css/style.css' rel='stylesheet' type='text/css' />
<script type='text/javascript' charset='utf-8' src='js/validateInput.js'></script>
</head>
<body>
<div id='header'><h1>$title<h1></div>
<form name='login' method='post' action=''>
<table border='0'>
<tr>
<th>E-mail:</th>
<td colspan='2'><input type='text' name='email' id='email' size='30' value='$posted_email'
onkeyup='validate()' onclick='validate()' onchange='validate()' />
</td>
</tr>
<tr>
<th>Heslo:</th>
<td><input type='password' name='pword' id='pword' size='21'
onkeyup='validate()' onclick='validate()' onchange='validate()'/></td>
<td><input type='submit' name='login' class='submit' id='loginBtn' value='OK' /></td>
</tr>
</table>
</form>
</body>
今私のJS:
function $(id) {
if (id.indexOf('#') == 0 || id.indexOf('.') == 0) {
var name = id.substr(1);
return id.indexOf('#') == 0 ? document.getElementById(name) : document.getElementsByClassName(name);
}
return (typeof document.getElementById('id') !== 'undefined') ? document.getElementById(id) : document.getElementsByClassName(id);
}
function validateEmail(string) {
var re = /[\w\s\.\$\*\+\/\?\^\{\|\}\(\)]{1,64}@[\w]{1,250}\.[\w]{2,3}/;
return re.test(string);
}
function validate() {
var login = $('#loginBtn');
var email = $('#email');
var pword = $('#pword');
if (!validateEmail(email.value)) {
email.style.color = 'orange';
} else if (pword.length > 0) {
login.disabled = false;
}
return false;
}
window.onload = function() {$('#loginBtn').disabled = true;};
何かご意見は?