2013-09-28 118 views
0

新手試圖用jquery簡單登錄表單。jquery newbie:回調只觸發一次

單擊按鈕後,如果有空白文本字段,應顯示錯誤消息,然後隱藏。它只工作一次,如果再次單擊該按鈕,則不會觸發回調。

任何幫助非常感謝!

$("#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>&nbsp;USER LOGIN&nbsp;</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">&nbsp;Login&nbsp; 
     </button> 
    </div> 
    </fieldset> 
    </form> 

回答

0

有一個在你打電話.Show(), 錯誤應該是:

$("#err_msg").addClass("ui-state-error ui-corner-all").text("Insert your email address and password").show(500, callback); 

看到這個工作的jsfiddle:

http://jsfiddle.net/UxUap/

+0

許多感謝您指出了出來了!對於「盲」效應,我有一個大寫的「B」。愚蠢的我。 – user988971