Html 是否有自动将表单元素映射到JSON的javascript(首选jquery)库?
背景:在JSON被称为JSON之前,我就一直在寻找这个东西 假设代码中有以下javascript变量:Html 是否有自动将表单元素映射到JSON的javascript(首选jquery)库?,html,json,forms,translation,Html,Json,Forms,Translation,背景:在JSON被称为JSON之前,我就一直在寻找这个东西 假设代码中有以下javascript变量: jsonroot = { 'fname':'valued' ,'lname':'customer' ,faves:['berry','chocolate','mint'] ,actors:[ {'fname':'brad','lname':'pitt'} ,{'fname':'mike','lname':'hammer'}
jsonroot =
{
'fname':'valued'
,'lname':'customer'
,faves:['berry','chocolate','mint']
,actors:[
{'fname':'brad','lname':'pitt'}
,{'fname':'mike','lname':'hammer'}
]
};
您可以很容易地看到它是如何映射到JSON的,这是一个1:1的对应关系
问题:是否有一个库可以将这1:1的对应关系带入HTML表单元素?例如,我想在表单元素中执行以下操作:
<input type="text" mapping="jsonroot['fname']" id="fname"></input>
<input type="text" mapping="jsonroot['lname']" id="lname"></input>
<legend>
<fieldset>Favorite Flavors</fieldset>
<input type="text" mapping="jsonroot['faves'][0]" id="fave_0"></input>
<input type="text" mapping="jsonroot['faves'][1]" id="fave_1"></input>
<input type="text" mapping="jsonroot['faves'][2]" id="fave_2"></input>
</legend>
<legend>
<fieldset>Favorite Actors</fieldset>
<input type="text" mapping="jsonroot['actors'][0]['fname']" id="fave_0_fname"></input>
<input type="text" mapping="jsonroot['actors'][0]['lname']" id="fave_0_lname"></input>
<input type="text" mapping="jsonroot['actors'][1]['fname']" id="fave_1_fname"></input>
<input type="text" mapping="jsonroot['actors'][1]['lname']" id="fave_1_lname"></input>
</legend>
最喜欢的口味
喜爱的演员
基本原理:有时,我不想通过POST或GET提交表单变量,而是想将它们传递到javascript变量中,然后对该变量执行一些操作,然后将其发送到某个地方
编写HTML表单JSON翻译是乏味的。我不可能是唯一一个想这样做的人,那么有没有一个库可以自动处理这个问题呢?使用类似的方法。它添加了$.toJSON()
和$.parseJSON()
方法。将其与将表单序列化为对象的代码结合使用,例如:
另见:
$.fn.serializeObject = function()
{
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name]) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
};