Jquery映射数组键和值

Dev*_*Wol 5 javascript arrays ajax jquery

我在其他StackOverFlow问题上研究了这个,我似乎无法找到答案.

我有一张表格.

<input name="item[1]" class="item" value="1">
<input name="item[2]" class="item" value="50">
<input name="item[3]" class="item" value="12">
Run Code Online (Sandbox Code Playgroud)

我正在尝试获取每个项目输入的结果并通过Ajax将它们发送到我的控制器,这在使用form action =""方法时很好,但是通过ajax我似乎无法格式化数组格式的数据.

谁能告诉我我做错了什么?

$('button#despatchOrder').on('click', function() {

    var values = $("input.items");

    var myArray = $.map(values, function(value, index) {
       return [value];
    });

    console.log(myArray);

});
Run Code Online (Sandbox Code Playgroud)

不幸的是,Jquery不是我最强的语言,但我正在学习.我期待输出就像.

items = [
 1 => 1,
 2 => 50,
 3 => 12
]
Run Code Online (Sandbox Code Playgroud)

但是我把所有与输入相关的东西都像

Input 1 = [
accept
accessKey
alt 
etc
etc
]
Run Code Online (Sandbox Code Playgroud)

T.J*_*der 7

谁能告诉我我做错了什么?

很少!:-)

  • 在你的$.map回调中,第一个参数将是元素,而不是它的值,所以你只需要使用它的value属性.
  • 你也把它包装在一个return [value]你不想做的数组()中; $.map将根据您从每次调用返回到回调的值构建一个数组.
  • 此外,你正在使用input.items你想要的地方input.item.
  • index如果不使用参数,则无需声明参数.

    $('button#despatchOrder').on('click',function(){

    var values = $("input.item");                          // ***
    
    var myArray = $.map(values, function(element) {        // ***
       return element.value;                               // ***
    });
    
    console.log(myArray);
    
    Run Code Online (Sandbox Code Playgroud)

    });

例:

$('button#despatchOrder').on('click', function() {
    var values = $("input.item");
    var myArray = $.map(values, function(element) {
       return element.value;
    });
    console.log(myArray);
});
Run Code Online (Sandbox Code Playgroud)
<input name="item[1]" class="item" value="1">
<input name="item[2]" class="item" value="50">
<input name="item[3]" class="item" value="12">
<button id="despatchOrder">Despatch</button><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Run Code Online (Sandbox Code Playgroud)

这为您提供了数组中的项目而不使用item[1]和这样的名称.你所展示的是你想要的

items = [
 1 => 1,
 2 => 50,
 3 => 12
]
Run Code Online (Sandbox Code Playgroud)

是无效的JavaScript.以上给出了:

myArray = ["1", "50", "12"];
Run Code Online (Sandbox Code Playgroud)

但是如果你想要名字/值对,可能最好是一组对象:

myArray = [
 {name: "1", value: "1"},
 {name: "2", value: "50"},
 {name: "3", value: "12"}
]
Run Code Online (Sandbox Code Playgroud)

要做到这一点:

    var myArray = $.map(values, function(element) {
       return {name: element.name.substring(5, 6), value: element.value};
    });
Run Code Online (Sandbox Code Playgroud)

或者当然,如果您想要整个名称item[1],只需删除该substring部分即可.

例:

$('button#despatchOrder').on('click', function() {
    var values = $("input.item");
    var myArray = $.map(values, function(element) {
       return {name: element.name.substring(5, 6), value: element.value};
    });
    console.log(myArray);
});
Run Code Online (Sandbox Code Playgroud)
<input name="item[1]" class="item" value="1">
<input name="item[2]" class="item" value="50">
<input name="item[3]" class="item" value="12">
<button id="despatchOrder">Despatch</button><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Run Code Online (Sandbox Code Playgroud)


只是为了完整性,你也可以使用其他 map函数(jQuery有两个),但它对你没有任何好处:

var myArray = values.map(function() {
    return this.value;
}).get();
Run Code Online (Sandbox Code Playgroud)

注意.get()最后.