与jquery serializeArray()一起使用的函数,主要来方便提交表单
更新时间:2011年01月31日 15:07:27 作者:
与jquery serializeArray()一起使用的函数,主要来方便提交表单,需要的朋友可以参考下。
.serializeArray() 序列化表格元素 (类似 '.serialize()' 方法) 返回 JSON 数据结构数据。(摘自jquery文档)。
有以下一个表单窗口,代码:
<form action="" method="post" id="tf">
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<th>姓名:</th>
<td>
<input type="text" id="txtUserName" name="UserName" />
</td>
<th>联系手机:</th>
<td>
<input type="text" name="Mobile" id="txtMobile" maxlength="11"/>
</td>
</tr>
<tr>
<td style=" text-align:center;" colspan="2">
<input type="button" value=" 提 交 " style="padding-top:3px;" name="butsubmit" id="butsubmit"/>
</td>
</tr>
</table>
</form>
JavaScript代码处理表单:
<script>
$(function () {
$("#butsubmit").click(function(){
var data = convertArray($("#tf").serializeArray());
$.post(url, data, function (d) {},"json");
});
})
function convertArray(o) { //主要是推荐这个函数。它将jquery系列化后的值转为name:value的形式。
var v = {};
for (var i in o) {
if (typeof (v[o[i].name]) == 'undefined') v[o[i].name] = o[i].value;
else v[o[i].name] += "," + o[i].value;
}
return v;
}
</script>
有以下一个表单窗口,代码:
复制代码 代码如下:
<form action="" method="post" id="tf">
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<th>姓名:</th>
<td>
<input type="text" id="txtUserName" name="UserName" />
</td>
<th>联系手机:</th>
<td>
<input type="text" name="Mobile" id="txtMobile" maxlength="11"/>
</td>
</tr>
<tr>
<td style=" text-align:center;" colspan="2">
<input type="button" value=" 提 交 " style="padding-top:3px;" name="butsubmit" id="butsubmit"/>
</td>
</tr>
</table>
</form>
JavaScript代码处理表单:
复制代码 代码如下:
<script>
$(function () {
$("#butsubmit").click(function(){
var data = convertArray($("#tf").serializeArray());
$.post(url, data, function (d) {},"json");
});
})
function convertArray(o) { //主要是推荐这个函数。它将jquery系列化后的值转为name:value的形式。
var v = {};
for (var i in o) {
if (typeof (v[o[i].name]) == 'undefined') v[o[i].name] = o[i].value;
else v[o[i].name] += "," + o[i].value;
}
return v;
}
</script>
您可能感兴趣的文章:
- jQuery Form 表单提交插件之formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的应用
- jQuery中serializeArray()与serialize()的区别实例分析
- jQuery基于ajax()使用serialize()提交form数据的方法
- JQuery中serialize() 序列化
- JQuery中serialize()用法实例分析
- JQuery中serialize()、serializeArray()和param()方法示例介绍
- jQuery ajax中使用serialize()方法提交表单数据示例
- jQuery ajax serialize()方法的使用以及常见问题解决
- jQuery-serialize()输出序列化form表单值的方法
- jQuery使用serialize()表单序列化时出现中文乱码问题的解决办法
相关文章
jquery 关于event.target使用的几点说明介绍
本篇文章介绍了,jquery中关于event.target使用的几点说明。需要的朋友参考下2013-04-04浅谈jQuery中的eq()与DOM中element.[]的区别
下面小编就为大家带来一篇浅谈jQuery中的eq()与DOM中element.[]的区别。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧2016-10-10JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参
JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参(selected的值和页面其它元素的值)2011-01-01
最新评论