jQuery AJAX 提交表单

javascript jquery ajax forms submit

2022-08-29 22:06:56

我有一个带有名称和未定义输入数量的表单。orderproductForm

我想做某种jQuery.get或ajax或类似的东西，通过Ajax调用页面，并发送表单的所有输入。orderproductForm

我想一种方法是做这样的事情

jQuery.get("myurl",
          {action : document.orderproductForm.action.value,
           cartproductid : document.orderproductForm.cartproductid.value,
           productid : document.orderproductForm.productid.value,
           ...

但是，我并不完全知道所有表单输入。是否有功能，功能或仅发送所有表单输入的东西？

答案 1

这是一个简单的参考：

// this is the id of the form
$("#idForm").submit(function(e) {

    e.preventDefault(); // avoid to execute the actual submit of the form.

    var form = $(this);
    var actionUrl = form.attr('action');
    
    $.ajax({
        type: "POST",
        url: actionUrl,
        data: form.serialize(), // serializes the form's elements.
        success: function(data)
        {
          alert(data); // show response from the php script.
        }
    });
    
});

答案 2

您可以使用 Ajax Form Plugin 中的 ajaxForm/ajaxSubmit 函数或 jQuery 序列化函数。

AjaxForm：

$("#theForm").ajaxForm({url: 'server.php', type: 'post'})

或

$("#theForm").ajaxSubmit({url: 'server.php', type: 'post'})

ajaxForm 将在按下提交按钮时发送。ajax提交立即发送。

序列化：

$.get('server.php?' + $('#theForm').serialize())

$.post('server.php', $('#theForm').serialize())

AJAX 序列化文档在这里。