javascript - 如何获取具有数组名称的输入标签的检查值并将此值发送到服务器

Question

我有一个 html 表单:

<input name="arrayname[]" type="checkbox" value="1">
<input name="arrayname[]" type="checkbox" value="2">
<input name="arrayname[]" type="checkbox" value="3">
<input name="arrayname[]" type="checkbox" value="4">

请注意，输入标签的名称属性设置为arrayname[]。如果我单击一些复选框并提交表单，那么我将进入 $_POST 全局数组:

["arrayname"]=>
    array(2) {
    [0]=>
        string(1) "1"
    [1]=>
        string(1) "3"
    }

我想使用 jQuery 从输入标签中获取检查值，以便通过 ajax 将它们发送到服务器。我发明了 javascript 函数:

function myGetValue(fieldName)
{
    var value;
    value = $('input[name='+fieldName+']').val();
    return value;
}

但此函数适用于不带方括号的简单名称，例如“simplename”。例如:

<input name="simplename" type="text" value="my text">

<input name="arrayname[]" type="checkbox" value="1">
<input name="arrayname[]" type="checkbox" value="2">
<input name="arrayname[]" type="checkbox" value="3">
<input name="arrayname[]" type="checkbox" value="4">

如果我执行 alert(myGetValue('simplename')) 那么就可以了，我会得到输入字段的值。如果我执行 alert(myGetValue('arrayname')) 则它不正常并且我得到“未定义”。必须使用什么功能？我想获取名称为“arrayname”的输入标签的值，并通过 ajax 将其发送到服务器。我不能使用序列化或 json。即使使用 ajax，我也想获得与 $_POST 相同的数组。你可以在实例中看到我的代码 here

我只想发送选中的值。我通过 ajax 发送数据的代码:

var fieldName = 'simplename';
var fieldValue = myGetValue(fieldName);
var formaData = new FormData();
formaData.append(fieldName, fieldValue);
$.ajax({
    type: 'POST',
    data: formaData,
    processData: false,
    contentType: false,
});

Answer 1

您可以使用 .map()获取选中的复选框元素的值，如下所示 - 它将返回一个数组

function myGetValue(fieldName) {
    var value = $('input[name="' + fieldName + '"]:checked, input[name="' + fieldName + '"]:not(:checkbox, :radio)').map(function () {
        return this.value
    }).get();
    return value;
}

演示:Fiddle