初心者は、jquery を使用して単純なログイン フォームを試行します。
ボタンをクリックした後、空白のテキスト フィールドがある場合は、エラー メッセージが表示され、非表示になります。これは 1 回だけ機能し、ボタンが 2 回クリックされた場合、コールバックは発生しません。
どんな助けでも大歓迎です!
$("#login_button").click(function(event){
if ($('#email').val() == "" || $('#password').val() == "") {
event.preventDefault();
$("#err_msg") .addClass("ui-state-error ui-corner-all")
.text("Insert your email address and password")
.show("Blind", 500, callback);
}
function callback() {
setTimeout(function(){
$("#err_msg").removeAttr("style").fadeOut();
}, 1000);
};
});
<div id="err_container">
<div id="err_msg" ><%= errReason %></div>
</div>
<form id="login_form" name="login_form" method="post"
action="<%=request.getContextPath()%>/loginhandler">
<fieldset>
<legend> USER LOGIN </legend>
<div>
<label for="email">Email: </label>
<input type="text" id="email" name="email" />
</div>
<div>
<label for="password">Password: </label>
<input type="password" id="password" name="password" />
</div>
<div>
<button id="login_button"
class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all" type="submit"> Login
</button>
</div>
</fieldset>
</form>