Question

我有一个简单的HTML表单，在此表单中有一个部分，用户可以选择一个或多个复选框。我编写了一个JS函数，该函数获取每个复选框的值并将其放入字符串中：

function getSupportedDevices() {
    var supportedDevices = "";
    $('.devices:checkbox:checked').each(function () {
        let sThisVal = $(this).val();
        supportedDevices += sThisVal + ";";
    });
    console.log(supportedDevices);

    return supportedDevices;
}

此函数在Ajax调用之前被调用，结果应为appended to the FormData，以便以后可以使用该字符串。这是我尝试添加列表的代码：

var $debForm = $('#formDeb');
if ($debForm.length > 0) {
    $debForm.on('submit', function (event) {
        event.preventDefault();

        if (!isSubmitting) {
            let $form = $(this);
            let targetUrl = $form.attr('action');
            let method = $form.attr('method');
            let $btnSubmit = getElement($form, '.js-btn-submit');

            var myFormData = new FormData(this);
            var supportedDevices = getSupportedDevices();
            myFormData.append("supportedDevices", supportedDevices);

            $.ajax({
                type: method,
                url: targetUrl,
                data: myFormData,
                async: true,
                beforeSend: function () { ...

运行此代码会引发错误：

未捕获的TypeError：非法调用在添加时（jquery.js：8430）在buildParams（jquery.js：8417）在Function.jQuery.param（jquery.js：8450）在Function.ajax（jquery.js：9040）在HTMLFormElement。（submitdeb.js：45）在HTMLFormElement.dispatch（jquery.js：5206）在HTMLFormElement.elemData.handle（jquery.js：5014）

第45行为$.ajax。如果我尝试将data: new FormData(this).append("supportedDevices", getSupportedDevices())作为ajax参数，则不会出现任何错误，但是$_POST数组为空。

出现此错误我在做什么错？生成字符串的函数可以单独使用，如果我仅发送FormData而未附加任何内容，则$_POST数组不为空。

Answer 1

设置processData:false可以防止$.ajax尝试使用$.param()序列化FormData对象，当对象被传递给data时，默认情况下会这样做。

浏览器将在内部处理序列化

使用jQuery FormData.append将值附加到$ _POST数组

1 个答案: