Ajax表單不會發布

Question

有人可以解釋或告訴我為什么我的Ajax表單不會發布嗎？ 我正在使用smarty模板引擎。

表格

<form action="/ajax/update_details.php" method="post" id="detailsform">
    <input type="text" name="city" value="{$profile_user.city}" />
    <input type="text" name="profile_message" value="{$profile_user.profile_message}" />
    <textarea name="about_me" cols="53" rows="5" class="submit_form_textfield">{$profile_user.about_me}</textarea>
    <textarea name="hobbies" cols="53" rows="5" class="submit_form_textfield">{$profile_user.hobbies}</textarea>
    <input type="hidden" name="action" value="user_details" />
    <input type="submit" class="submit_form_button" value="Update Details" />
    <a class="success" style="display: none; color: green; text-align: centera;">Your details have been updated</a>
</form>

Java腳本

{literal}
<script type="text/javascript">
    $("#detailsform").submit(function() {                                       
    var url = "/ajax/update_details.php";                               
        $.ajax({
        type: "POST",
        url: url,
        data: $("#detailsform").serialize(),
        success: function(data)
        {
        $(".success").show(1000);
        $(".success").fadeOut(5000);
        }
    });                                     
    return false;
});
</script>
{/literal} 

和update_details.php

<?php

session_start();

require_once('../vars.php');
require_once('../includes/user.class.php');

$user = new User();

if (isset($action) && $action=='user_details' && isset($_SESSION['loggeduser_id'])){

    $city = preg_replace("/[^a-z]/i","",$_POST['city']);
    $profile_message = preg_replace("/[^a-z]/i","",$_POST['profile_message']);
    $about_me = ($_POST['about_me']);
    $hobbies = ($_POST['hobbies']);

    $user->update($_SESSION['loggeduser_id'],array("city" => $city,"profile_message" => $profile_message,"about_me" => $about_me,"hobbies" => $hobbies));   
}

?>

請有人幫我解決，因為我是編碼新手，不勝感激

Answer 1

您的代碼不會等待頁面加載，除非您的腳本就在</body>之前，否則您需要使用$(document).ready(function() {或$(function(){或任何其他有效語法。） ，它也需要關閉。

<script type="text/javascript">
$(document).ready(function() {
      $("#detailsform").submit(function(){  
         // etc
      });
});
</script>

參考： http : //api.jquery.com/ready/

Answer 2

添加文檔就緒處理程序。

$(function(){ 
     $("#detailsform").submit(function() {
         //your stuff here....
       }); 
 });

參考： Ajax表單不會發布