将表单数据转换为JSON对象 [英] Convert form data to JSON object
本文介绍了将表单数据转换为JSON对象的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我试图将 HTML
表单数据转换为 JSON
对象,我有这个线程,但我不知道为什么它不适合我。
I am trying to convert the HTML
form data into a JSON
object, I have this thread, but I don't know why it is not working for me. I am using the following code.
<form id="myform" action="" method="post">
<div class="form-field">
<label for="title">Title</label>
<input name="title" id="title" type="text" value="" size="40" aria-required="true">
</div>
<div class="form-field form-required">
<label for="your-name">Your Name</label>
<input name="yourName" id="yourName" type="text" value="" size="40" aria-required="true">
</div>
<div class="form-field">
<label for="contact-no">Contact No:</label>
<input name="contact" id="contact" type="text" value="" size="40" aria-required="true">
</div>
<div class="form-field">
<label for="description">Description:</label>
<textarea name="description" id="description" rows="1" cols="40" aria-required="true"></textarea>
</div>
<div class="form-field">
<label for="email">Email:</label>
<input name="email" id="email" type="text" value="optional" size="40" aria-required="true">
</div>
<div class="form-field">
<label for="city">City:</label>
<input name="city" id="city" type="text" value="" size="40" aria-required="true">
</div>
<div class="form-field">
<label for="country">Country:</label>
<input name="country" id="country" type="text" value="" size="40" aria-required="true">
</div>
<div class="form-field">
<label for="pic1">Picture 1:</label>
<input type="file" name="pic1" id="pic1">
</div>
<div class="form-field">
<label for="pic2">Picture 2:</label>
<input type="file" name="pic2" id="pic2">
</div>
<div class="form-field">
<label for="pic3">Picture 3:</label>
<input type="file" name="pic3" id="pic3">
</div>
<div class="form-field">
<label for="pic4">Picture 4:</label>
<input type="file" name="pic4" id="pic4">
</div>
<div class="form-field">
<label for="pic5">Picture 5:</label>
<input type="file" name="pic5" id="pic5">
</div>
<div class="form-field">
<label for="demand">Your Demand:</label>
<input name="demand" id="demand" type="text" value="" size="40" aria-required="true">
</div>
<p class="submit">
<input type="submit" name="postAd" id="postAd" class="button" value="Post Ad For Review">
</p>
<div id="results">hello</div>
</form>
$(document).ready(function(){
$.fn.serializeObject = function() {
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name] === undefined) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
alert(this.name);
o[this.name] = this.value || '';
}
});
return o;
};
$('#myform').submit(function() {
$('#result').text(JSON.stringify($('#myform').serializeObject()));
return false;
});
});
我试图调试它,并且我注意到当我的函数运行时,它总是运行代码在else语句中。
I tried to debug it, and I noticed that when my function is run, it always runs the code within the else statment.
推荐答案
我在JSFiddle中添加了上述表单,并将JSON数据显示为输出。
I added above form in JSFiddle and it displays JSON data as output.
使用JSFiddle (函数(){
$('form')。submit(函数(){
$)
Working JSFiddle
$(function() {
$('form').submit(function() {
$('#result').text(JSON.stringify($('form').serializeObject()));
return false;
});
});
这篇关于将表单数据转换为JSON对象的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文