0

新手尝试使用 jquery 的简单登录表单。

单击按钮后,如果有空白文本字段,则应显示错误消息,然后隐藏。它只工作一次,如果第二次单击该按钮,则不会触发回调。

非常感谢任何帮助!

$("#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>
4

1 回答 1

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/

于 2013-09-28T09:12:46.097 回答