使用 jQuery 发布表单并将其添加到页面

Question

嘿！
我有这个表单的代码：

<form class="myform" name="myform" method="POST" action="post.php">
<textarea id="mytextarea" name="mytextarea"></textarea>
<button>Share</button>
</form>

我也有这个页面的代码：

<div class="content">
<div class="message">That message</div>
<div class="info">Published 10/10/10 </div>
</div>
<div class="content">
<div class="message">That other message</div>
<div class="info">Published 10/9/10 </div>
</div>

是否可以使用 jQuery 发送表单，而不必重新加载整个页面？我可以检索表单的响应并将响应放在第一个 <div class="content"> 的顶部吗？
注意：我有多个具有相同类的表单。
非常感谢！

Answer 1

是的，使用 jQuery 发送表单相当简单。

有一个使用 AJAX 发布数据的简单函数，并且很容易绑定表单的值：

$.post(url, $('#myform').serialize(), function(data) { 
    $('#content').prepend(data);
})

$.post 是简单的方法。如果你需要检查错误等等，你应该检查 $.ajax (http://api.jquery.com/jQuery.ajax)。

Answer 2

要使用 jQuery 提交表单，我相信您需要检查一下：http://api.jquery.com/submit/

我相信您可以通过以下方式检索提交的数据：

$('[name=mytextarea]').val()`

Answer 3

是的，这当然是可能的，使用 AJAX：

$('.myform').submit(function(e){
    var data = $(this).serialize();
    e.preventDefault();

    $.ajax({
        url: this.action,
        type: 'POST',
        success: function(data) {
            $('#content').prepend(data);
        },
        error: function() {
            alert('oops, something went wrong');
        }
    );
});