代码之家  ›  专栏  ›  技术社区  ›  bart

如何访问JQuery中serializeArray创建的值?

  •  21
  • bart  · 技术社区  · 15 年前

    我有这个HTML:

    <form id='myform'>
    <input name='title' value='foo'/>
    </form>
    

    我用它创建了一个对象数组,如下所示:

    var dataArray = $("#myform").serializeArray();
    

    现在如何访问dataArray中的“title”?这不起作用:

    alert(dataArray['title']);
    alert(dataArray['title'].val());
    
    8 回复  |  直到 15 年前
        1
  •  31
  •   Jason    14 年前

    类似于尼克的帖子,但有点干净

    var dataArray = $("#myform").serializeArray(),
        dataObj = {};
    
    $(dataArray).each(function(i, field){
      dataObj[field.name] = field.value;
    });
    

    然后以同样的方式进入

    alert(dataObj['title']);
    
        2
  •  29
  •   Community Mohan Dere    8 年前

    你要么绕过去, as @Tom has …或者,如果您访问多个对象,请更高效地循环一次,创建如下对象:

    var dataArray = $("#myform").serializeArray(),
        len = dataArray.length,
        dataObj = {};
    
    for (i=0; i<len; i++) {
      dataObj[dataArray[i].name] = dataArray[i].value;
    }
    

    然后可以按需访问它,例如:

    alert(dataObj['title']); //or alert(dataObj.title);
    

    You can test it out here .

        3
  •  14
  •   Tom    15 年前
    alert(dataArray[0].name);
    alert(dataArray[0].value);
    

    所以:

    for (i=0; i<dataArray.length; i += 1) {
        if (dataArray[i].name === "title") {
            // do something here...
        }
    }
    
        4
  •  3
  •   Eric    15 年前

    跑步 console.log(dataArray); ,然后打开属性检查器,并检查控制台。在Chrome中,右键单击并选择“Inspect Element”,然后单击左下角的“>=”查找图标,这是左下角的第二个图标。

    在Firefox中你会安装firebug并且有一个名为“控制台”的标签

    不确定它是否在IE中可用,可能在开发工具中(按 12层 )但我不建议在IE中开发。

    无论如何,这将以允许您导航和查看每个项的值的方式列出对象。这样,您就可以使用它来解密如何访问这些值:)

    祝你好运

        5
  •  3
  •   krlwbstr    10 年前

    无论如何都要添加这个来帮助其他人。快速检查所有值的好方法。

    var formdata = $( "#myform" ).serializeArray();
    var formdata = JSON.stringify(formdata);
    alert (formdata);
    
        6
  •  2
  •   Simo Mafuxwana    12 年前

    追加/回音/打印 dataArray[0].name 给一个div会给你“头衔”

        7
  •  2
  •   gordon    11 年前

    警告myDiv中输入的serializeArray(注意: :input 选择器还将包括select和textarea标记!):

    //alert(fData.length) // how many inputs got picked up 
    var fData=$("#myDiv :input").serializeArray();
    var msg=""; 
    for(var i=0;i<fData.length;i++){
        var raKy=Object.keys(fData[i]); 
        msg+="\n"+raKy[0]+":"+eval("fData[i]."+raKy[0])+" "+raKy[1]+":"+eval("fData[i]."+raKy[1]); 
    }
    alert(msg);
    
        8
  •  0
  •   Aakash    7 年前

    uderscore.js ,这就是我们的方法:

    var serializedArray = $('form#spiderman-application').serializeArray();
    
    var serializedObject = _.object(
      _.pluck(serializedArray, 'name'), 
      _.pluck(serializedArray, 'value')
    )
    
    console.log(serializedObject);
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
    
    <form id="spiderman-application">
      <legend>Application Form</legend>
      <input name="./fname" value="Peter" />
      <input name="./lname" value="Parker" />
    </form>

    祝你好运。。。