Question

我想做什么：

当我点击提交按钮（例如谷歌）时，我的脚本应该......

追加＆＃34; loading.gif＆＃34;使用ID = #loading来模拟页面正在加载的DIV
检查用户是否正确填写了表单。如果没有，则应显示弹出窗口。
之后应该转到GOOGLE

我知道这很容易，但到目前为止，我无法在代码中找到错误。我的JSFiddle：http://jsfiddle.net/cZshY/

示例如果有人把错误的大学（柏林而不是汉堡）放入大学＆＃34;这应该发生：

应该出现loading.gif。
之后会弹出一条消息（＆＃34;错误的大学＆＃34;）

我的HTML：

<div>
    <form>
        <p>Nickname: <input name="name" type="text" id="nickname"></p>
        <p>University: <input name="university" type="text" id="univer" value="University of Berlin">
        <p>Login: <input name="login" type="text" id="loginData" value="LE_StuRa"></p>
        <p>Password:<input name="passwordfield" type="password" id="passw" value="34kle1"></p>
    </form>
</div>

<div id="loading"></div>

<form action="http://google.com">
    <input type="submit" value="Continue" id="googleButton">
</form>

我的Javascript / jquery：

$(document).ready(function(){
    $("#googleButton").click(function(){                
        var load = $("<img src='http://www.tj-auctions.com/images/loading.gif'/>"); 
        $(load).prependTo("#loading").fadeOut(3000, function(){

            if ( $("#loginData").val() != "LE_StuRa" || $("#univer").val() != "University of Hamburg" ) {
                alert ("Wrong login data");
                return false;
            }; 

            if ( $("#passw").val() != "34kle1" ) {
                alert ("Wrong password");
                return false;
            };

            if ( !$("#nickname").val() ) {
                alert ("Please enter a nickname!");
                return false;
            });

        }); 
    });
});

Answer 1

删除结束＆＃39;）＆＃39;在最后一个if语句之后。

代码应为

if ( !$("#nickname").val() ) {
  alert ("Please enter a nickname!");
  return false;
 };

Answer 2

哦，好吧，我想通了（感谢Barmar）：

jsfiddle.net/cZshY/20

我将if语句放入fadeOut的回调函数中。当我首先检查if语句并将（1）“加载gif”和（2）“警告消息”放入if语句时，一切正常。

if语句应如下所示：

if ( $("#loginData").val() != "LE_StuRa" || $("#univer").val() != "University of Hamburg" ) {
    $(load).prependTo("#loading").fadeOut(3000, function(){
        $("#loading").html("Wrong university!");    // or alert, but I think this looks better.
    });
    return false;
};

如何在提交表单之前检查表单中的值？

2 个答案: