将 HTML 表单数据提交到 div 元素而不刷新页面答案

【问题标题】：Submit HTML form data to a div element without refreshing a page将 HTML 表单数据提交到 div 元素而不刷新页面
【发布时间】：2012-07-04 08:59:49
【问题描述】：

我已将在 JQuery 中创建的向下滑动面板放入表格中，该面板包含联系表格。我需要发布该表单数据，但防止在点击提交按钮后重新加载所有页面，因为在页面重新加载后，向下滑动面板也会重新加载并且它会缩小。我只需要刷新 div 元素即可将表单数据获取到 PHP。

<div id="form">
    <form id="form" action="/">
       <br />
                <p>
                <label for="name"><small>Name *</small></label><br />
                  <input type="text" name="name" id="name" value="" size="15" />

                </p>
                <p>
                   <label for="email"><small>Mail *</small></label><br />
                  <input type="text" name="email" id="email" value="" size="15" />

                </p>
                <p>
                <label for="comments"><small>Message *</small></label>
                  <textarea name="comments" id="comments" rows="10" cols="5"></textarea>
                </p>
                <p>
                  <input name="submit" type="submit" id="submit" value="Send" />
                  &nbsp;
                  <input name="reset" type="reset" id="reset" tabindex="5" value="Reset" />
                </p>
              </form>
</div>

【问题讨论】：

标签： php html ajax

【解决方案1】：

首先制作提交按钮：

<input name="submit" type="button" id="submit" value="Send" />

然后使用这个：

$("#submit").click(function(){
  $.post("test.php", $("#form").serialize());
});

http://jsfiddle.net/g3Ubh/

【讨论】：