javascript - 使用 ajax 和未知表单字段发布表单

Question

使用 jQuery，使用 ajax 将数据发布到服务器非常简单。

是否有一个 jquery 函数可以使用表单名称发布表单并像其他传统的 ajax post 调用一样从服务器接收状态。

但是，如果我们只是想通过名称或 ID 来发布表单，并且我有一组未知的表单字段，该怎么办？

我想做的是获取页面上的表单，然后提交表单和当前数据

查看示例代码:

HTML

<form name='myform'>
    <input type='hidden' value='1' name='somefield'>
    <input type='hidden' value='2' name='somefield2'>
    <input type='hidden' value='3' name='somefield3'>

</form>

<a href='#' class='postform' form_name='myform'>post using ajax</a>

JS

$('.postform').click( function() {

    form_name = $(this).attr('form_name');

    postto = 'http://mysite-endpoint.com/api';

    form = $(form_name).submit(postto).done(function(data)
    {
        var ndata = jQuery.parseJSON(data);

        if(ndata.status=='error')
        {
            //display error
        }

        if(ndata.status=='success')
        {
            //looks good
        }
    });

    return false;
});

Answer 1

您可以使用jQuery $.serialize()对表单进行标记并根据表单属性进行提交。像这样的事情:

$('#someform').submit(function(ev) {
    ev.preventDefault();
    var $form = $(this);

    $.ajax($form.attr('action'), {
        type: $form.attr('method') || 'get',
        data: $form.serialize(),
    }).then(function() {
        alert('success');
    }, function() {
        alert('error');
    });
});

Here's a fiddle.