2

如何像数据库一样将数据存储为 JSON，以便用户注册时将信息存储在变量中？

例子：

我的 HTML 表单由输入文本字段名、姓氏组成。单击表单的注册按钮应将名字和姓氏的值存储在变量中。

我怎样才能做到这一点：

 var txt = '{"employees":[' +
   '{"firstName":"John","lastName":"Doe" },' +
    '{"firstName":"Anna","lastName":"Smith" },' +
     '{"firstName":"Peter","lastName":"Jones" }]}';
4

4 回答 4

2

Sounds like you want to go from values in HTML to a JSON string. Assuming <form> looks like this

<form>
    <input type="text" name="nm1[]"/><input type="text" name="nm2[]"/>
    <input type="text" name="nm1[]"/><input type="text" name="nm2[]"/>
</form>

You can use getElementsByName twice, build an Object and JSON.stringify it

var nm1 = document.getElementsByName('nm1[]'),
    nm2 = document.getElementsByName('nm2[]'),
    i, o = {
        employees: []
    };
for (i = 0; i < nm1.length; ++i) {
    if (nm1[i].value && nm2[i].value)
        o.employees.push({
            firstName: nm1[i].value,
            lastName: nm2[i].value
        });
}
JSON.stringify(o);

DEMO (open console)

于 2013-08-26T12:31:19.690 回答
1

您可以通过将数据附加到employees数组中来将数据添加到实际数据结构中，例如

dataobj.employees.push({"firstName":$('input[name=firstn]').val(),
                        "lastName":$('input[name=lastn]').val() });

当然，这需要首先将 JSON 解析为 dataobj。如果要发送，必须再次序列化GET。但它可以POST直接作为数据对象编辑！

你当然也可以从一个空数组开始，像初始化 dataobj

var dataobj={ employee: [] };

在上述更新命令生效之前。

一个很晚的编辑...

以防万一应该有多个名字/姓氏输入字段，那么以下将做一个“更好”的工作（因为它将查看所​​有字段并仅收集那些至少设置了一个名称的字段）： 

var dataobj={employees:[]};
function shw(){
  $('#out').text(JSON.stringify(dataobj).replace(/{/g,'\n{'));}
$(function(){
  $('#clr').click(function(){dataobj.employees=[];shw()});
  $('#go').click(function(){
   var ln=$('input[name=lastn]').toArray();     // ln: JS-Array of DOM elements
   $('input[name=firstn]').each(function(i,fn){ // for each fn DOM-element ...
    var f=fn.value,l=ln[i].value;               // get values as strings
    if (f+l>'') dataobj.employees.push({firstName:f,lastName:l}); // push name object
   });shw();})
  shw();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="firstn" value="John"><input type="text" name="lastn" value="Doe"><br>
<input type="text" name="firstn" value="Anna"><input type="text" name="lastn" value="Smith"><br>
<input type="text" name="firstn" value="Peter"><input type="text" name="lastn" value="Jones">
<input type="button" id="go" value="append names">
<input type="button" id="clr" value="clear">
<pre id="out"></pre>

于 2013-08-26T12:31:04.250 回答
0

您可以使用push数组的方法来推送 JSON 数据。这显示在这里 - appending-to-a-json-object。在需要提交数据之前（比如 to process.php），将其字符串化。

于 2013-08-26T12:30:54.937 回答
0

轻松使用 Jquery

var jsonArray;
jsonArray.push($("#firstname").val();
jsonArray.push($("#lastname").val();
var myJsonString = JSON.stringify(jsonArray);
于 2013-08-26T12:35:35.593 回答