与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实现智能提示控件intellSeach.js
这篇文章主要为大家详细介绍了基于jquery实现智能提示控件intellSeach.js的相关资料，感兴趣的小伙伴们可以参考一下2016-03-03
这是一个仿糯米弹框效果demo，点击文字即可弹出欢迎来到糯米网的界面，需要的朋友可以参考下2014-07-07
好久没有温习JS了。 最近看到VS2010把Jquery作为JS标准库纳入了Web项目里，再不会用Jquery，真怕自己“OUT”了。2010-05-05
这篇文章主要介绍了jquery实现简单的轮换出现效果,涉及jquery针对图片样式切换效果的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-07-07
这篇文章主要为大家详细介绍了layui弹出层效果的实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-05-05
这篇文章主要介绍了jQuery获取table下某一行某一列的值实现代码的相关资料,需要的朋友可以参考下2017-04-04
这篇文章主要介绍了jQuery实现网页顶部固定导航效果代码,涉及jQuery响应scroll事件动态操作页面元素样式的相关技巧,需要的朋友可以参考下2015-12-12
这篇文章主要为大家详细介绍了基于jquery实现无限级树形菜单的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-03-03
这些天在做一个效果，鼠标经过，PNG图片由透明变成不透明, 但是会出现黑边，晚上查了好多办法，分别对IE8设置过滤器啊等等，都不见效果。最终在热心网友的帮助下解决了问题，下面我们就来分析下2015-08-08
这篇文章主要介绍了基于Jquery代码实现手风琴菜单，代码简单易懂，需要的朋友参考下2015-11-11
最新评论