表单提交无刷新页面

Question

有人能告诉我使用jQuery的无刷新页面显示成功的表单提交的教程。类似的情况发生在gmail上，当一个消息被传递时，黄色的覆盖图显示你的消息已被传递，然后淡出。 我希望显示的消息取决于表单提交的结果。

Answer 1

好吧......这样的事情......但我没有尝试...所以使用它，就像教程。您也可以使用JSON

JS：

function processForm() { 
     $.ajax({ 
      type: 'POST', 
      url: form_process.php, 
      data: 'user_name=' + encodeURIComponent(document.getElementById('user_name').value), 
      success: function(data) { 
       $('#message').html(data); 
      } 
     }); 
} 

HTML：

<form action="" method="post" onsubmit="processForm();return false;"> 
<input type='text' name='user_name' id='user_name' value='' /> 
<input type='submit' name='submit' value='submit'/> 
</form> 
<div id='message'></div> 

form_process.php

$user_name = $_POST['user_name']; 
if(do something){ 
    echo "login success"; 
else{ 
    echo "login unsuccessful"; 
} 

Answer 2

jatt的答案几乎是正确的。但不要忘记将url属性设置为'' 这可能会节省您几分钟的调试时间，希望能够