未捕获的类型错误：action.serialize不是一个函数。

Question

这是我的代码长这样：

<form id="form1" method="post">
    <div class="row top-buffer">
        <div class="col-cs-6 col-md-8">
            <input type="param" id="name2" name="value" class="form-control" value="test2">
        </div>
        <div class="col-cxs-6 col-md-4">
            <button type='submit' value='test' class='send button btn btn-danger'>Lägg till</button> <!-- changed -->
        </div>
    </div>
</form>
<form id="form2" method="post">
    <div class="row top-buffer">
        <div class="col-cs-6 col-md-8">
            <input type="param" id="name2" name="value" class="form-control" value="test">
        </div>
        <div class="col-cxs-6 col-md-4">
            <button type='submit' value='delist' class='send button btn btn-danger'>Ta bort</button> <!-- changed -->
        </div>
    </div>
</form>

$(".send").click(function() {
    var myform = $(this).closest("form");
    var sForm = myform.serialize();
    var action = $(this).val();
    var sAction = $(this).val().serialize();;

    $.ajax({
        type: "POST",
        url: "ajax.php",
        data: sForm, sAction,
        success: function(data) {
            $('#response').html(data);
        }
    });
    return false; 
});

我目前收到以下错误：

whitelist.php:67 Uncaught TypeError: action.serialize 不是一个函数(…)

如果我将data更改为以下内容，则不会出现任何错误，但数组会崩溃。

data: { mySform, 'Param': action },

数组最终看起来像这样：

Array
(
    [mySform] => value=test2
    [Param] => test
)

为了澄清一些事情，我想要的是数组看起来像这样：

Array ( [Param] => value [Action] => value ) 

我希望我的jQuery能够处理超过3个表单。非常感谢您的帮助，因为我对jQuery和AJAX非常陌生。

- Carl Nettelblad

Answer 1

首先，你得到了“serialize is not a function”错误，因为你在一个字符串上调用它。它应该被调用在包含在jQuery对象内的“form”元素上。

其次，你需要将点击按钮的值追加到从“serialize()”方法生成的查询字符串中。

最后，要正确地停止表单提交，你应该将事件钩子挂接到“form”元素本身上。请尝试以下操作：

$("form").submit(function(e) {
    e.preventDefault();
    var $form = $(this);
    var action = $form.find('.send').val();

    $.ajax({
        type: "POST",
        url: "ajax.php",
        data: $form.serialize() + '&action=' + action,
        // data: $form.serialize() + '&' + $.param({ action: action }) // alternative
        success: function(data) {
            $('#response').html(data);
        }
    });
});

- Rory McCrossan