为什么我的jQuery代码不工作？

Question

嗯，我知道代码的作品，因为我在其他三个页面上使用它，它工作正常，但我已经移动到使我的网站的移动版本。基本上，代码用于实时登录。它序列化用户数据，显示“登录”消息，然后向文件发送ajax请求。该文件的响应内容将替换登录消息，并根据情况发生不同的事情。我直接从一个工作示例中移植了代码，现在，尽管代码有很多更改，但jquery似乎根本没有触发。这里是我的jQuery代码：

function login() { 
    var dataString = $('#login_form').serialize(); 
    console.log(dataString); 
    $(".menu_login_form").html("<center>Logging in...</center>"); 
    $.ajax({ 
     type: "POST", 
     url: "../include/actions/login.php", 
     data: dataString, 
     cache: false, 
     success: function(html){ 
     $(".menu_login_form").html(html); 
     } 
    }); 
    return false; 
    }; 
    $("#login_form").on("submit", login); 

这里是我的html代码：

<div class="menu_login_form"> 
    <form id="login_form" method="post"> 
    <input type="text" name="username" placeholder="Username"><br> 
    <input type="password" name="password" placeholder="Password" style=""><br> 
    <input type="checkbox" name="remember" checked="checked" style="margin:0;margin-right:10px;margin-top:-2.5px"><span>Remember Me</span><br> 
    <input type="submit" value="Login..." id="login_form_btn" class="btn"> 
    </form> 
</div> 

有谁知道什么是错在这里？

编辑：我现在正在工作，我只是把它放在错误的地方 - joeframbach我已经接受你的答案，因为它是唯一的那里。感谢您的所有建议。

Answer 1

将其包装在文档就绪的咒语中。这告诉jquery在做任何事之前等待页面完全加载。

$(function() { 
function login() { 
    var dataString = $('#login_form').serialize(); 
    console.log(dataString); 
    $(".menu_login_form").html("<center>Logging in...</center>"); 
    $.ajax({ 
     type: "POST", 
     url: "../include/actions/login.php", 
     data: dataString, 
     cache: false, 
     success: function(html){ 
     $(".menu_login_form").html(html); 
     } 
    }); 
    return false; 
}; 
$("#login_form").on("submit", login); 
});