Javascript 从表单生成JSON
我想生成JSON数据,比如Javascript 从表单生成JSON,javascript,jquery,json,Javascript,Jquery,Json,我想生成JSON数据,比如 { "first_name": "fname", "last_name": "lname", "zip": "123456", "subjects": [ { "name": "bee" }, { "name": "ms" }, { "name": "edc" }
{
"first_name": "fname",
"last_name": "lname",
"zip": "123456",
"subjects": [
{
"name": "bee"
},
{
"name": "ms"
},
{
"name": "edc"
}
]
}
从以下表格
<form action="" method="post">
first Name:<input type="text" name="first_name"/> <br/>
last name:<input type="text" name="last_name"/> <br/>
Widget URL:<input type="text" name="zip" /> <br/>
Support:<br/>
span3:<input type="checkbox" name="name" value="bee"/><br/>
span6:<input type="checkbox" name="name" value="ms"/><br/>
span12:<input type="checkbox" name="name" value="edc"/><br/>
<p><input type="submit" /></p>
</form>
名字:
姓氏:
小部件URL:
支持:
span3:
span6:
span12:
使用jquery。此表单结构是否适用于以下JSON结构?我需要脚本向用户提示json,您需要使用
提交表单后,可以使用php将JSON格式输出给用户
使用
在这里试试:有一个插件,其工作方式与jQuery内置数组函数相同
根据场景的不同,可以使用$(“input”)获取所有输入,并将name属性与val()匹配
var data = {};
data["first_name"] = $('input[name="first_name"]').val();
data["last_name"] = $('input[name="last_name"]').val();
console.log(data);
alert(JSON.stringify(data));
<?php echo json_encode($_POST); ?>
<form action="" method="post">
first Name:<input type="text" name="first_name"/> <br/>
last name:<input type="text" name="last_name"/> <br/>
Widget URL:<input type="text" name="zip"/> <br/>
Support:<br/>
span3:<input type="checkbox" name="subjects" value="bee"/><br/>
span6:<input type="checkbox" name="subjects" value="ms"/><br/>
span12:<input type="checkbox" name="subjects" value="edc"/><br/>
<p><input type="button" id="btnsubmit" value="submit"/></p>
</form>
<pre id="json_output"></pre>
$(document).ready(function(){
var formObject = {};
$('#btnsubmit').click(function(){
var formInputString = $('form').serialize();
var inputParameters = formInputString.split('&');
var nameValues = [];
$.each(inputParameters,function(i){
var inputParameter = inputParameters[i].split('='); // 0 - keyName , 1 - keyValue
var keyName = inputParameter[0];
var keyValue = inputParameter[1];
if(keyName == 'subjects'){
nameValues.push({ name : keyValue});
formObject[keyName] = nameValues;
}else{
formObject[keyName] = keyValue;
}
});
var myString = JSON.stringify(formObject);
$('#json_output').text(myString);
});
});
$('form').serializeObject();