Jquery把获取到的input值转换成json


Posted in jQuery onMay 15, 2017

话不多说,请看代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <title> jquery把获取到的input值转换成json</title>
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
 <link rel="stylesheet" type="text/css" href="" />
 <style type="text/css">
 .box{width:500px;height:500px;border:1px solid #e5e5e5;}
 </style>
 <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
 </head>
 <body>
 <div class="box">
    姓名:<input type="text" value="" name="username" /> <br/><br/>
    年龄:<input type="text" value="" name="age" /> <br/><br/>
    生日:<input type="text" value="" name="birth" /> <br/><br/>
    城市:<input type="text" value="" name="city" /> <br/><br/>
    省份:<input type="text" value="" name="provicen" /> <br/><br/>
    性别:<input type="text" value="" name="sex" /> <br/><br/>
    <input type="button" value="提交" class="comment">
 </div>
 <script type="text/javascript">
  $(document).ready(function(){
    $(".comment").click(function(){
      parArr = {};
       var username = $('input[name=username]').val().replace(/(^\s*)|(\s*$)/g, "");
       parArr.username = username;
       var age = $('input[name=age]').val().replace(/(^\s*)|(\s*$)/g, "");
       parArr.age = age;
       var birth = $('input[name=birth]').val().replace(/(^\s*)|(\s*$)/g, "");
       parArr.birth = birth;
       var city = $('input[name=city]').val().replace(/(^\s*)|(\s*$)/g, "");
       parArr.city = city;
       var provicen = $('input[name=provicen]').val().replace(/(^\s*)|(\s*$)/g, "");
       parArr.provicen = provicen;
       var sex = $('input[name=sex]').val().replace(/(^\s*)|(\s*$)/g, "");
       parArr.sex = sex;
       var params = JSON.stringify(parArr);
       alert(params);
    });
  });
 </script>
 </body>
</html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

jQuery 相关文章推荐
jQuery手风琴的简单制作
May 12 jQuery
jQuery实现radio第一次点击选中第二次点击取消功能
May 15 jQuery
jQuery操作之效果详解
May 19 jQuery
JQuery form表单提交前验证单选框是否选中、删除记录时验证经验总结(整理)
Jun 09 jQuery
jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例
Aug 04 jQuery
jQuery中extend函数简单用法示例
Oct 11 jQuery
jQuery实现弹窗下底部页面禁止滑动效果
Dec 19 jQuery
CSS3结合jQuery实现动画效果及回调函数的实例
Dec 27 jQuery
使用jQuery动态设置单选框的选中效果
Dec 06 jQuery
jQuery实现点击旋转,再点击恢复初始状态动画效果示例
Dec 11 jQuery
jquery实现自定义树形表格的方法【自定义树形结构table】
Jul 12 jQuery
jQuery模仿ToDoList实现简单的待办事项列表
Dec 30 jQuery
jQuery实现radio第一次点击选中第二次点击取消功能
May 15 #jQuery
jQuery返回定位插件详解
May 15 #jQuery
jQuery操作css样式
May 15 #jQuery
jQuery插件FusionCharts绘制的2D条状图效果【附demo源码】
May 13 #jQuery
jQuery插件FusionCharts绘制的2D双柱状图效果示例【附demo源码】
May 13 #jQuery
jQuery中clone()函数实现表单中增加和减少输入项
May 13 #jQuery
jQuery遍历节点方法汇总(推荐)
May 13 #jQuery
You might like
解析PHP中VC6 X86和VC9 X86的区别及 Non Thread Safe的意思
2013/06/28 PHP
php求数组全排列,元素所有组合的方法
2016/05/05 PHP
无需数据库在线投票调查php代码
2016/07/20 PHP
PHP实现字符串翻转功能的方法【递归与循环算法】
2017/11/03 PHP
PHP内部实现打乱字符串顺序函数str_shuffle的方法
2019/02/14 PHP
php设计模式之模板模式实例分析【星际争霸游戏案例】
2020/03/24 PHP
jQuery Dialog 弹出层对话框插件
2010/08/09 Javascript
js 实现菜单上下显示附效果图
2013/11/21 Javascript
关于JavaScript 原型链的一点个人理解
2016/07/31 Javascript
js实现统计字符串中特定字符出现个数的方法
2016/08/02 Javascript
Extjs gridpanel 中的checkbox(复选框)根据某行的条件不能选中的解决方法
2017/02/17 Javascript
详谈Angular路由与Nodejs路由的区别
2017/03/05 NodeJs
使用bootstrap-paginator.js 分页来进行ajax 异步分页请求示例
2017/03/09 Javascript
详解JavaScript的BUG和错误
2018/05/07 Javascript
Layui 设置select下拉框自动选中某项的方法
2018/08/14 Javascript
详解angular2如何手动点击特定元素上的点击事件
2018/10/16 Javascript
浅析Proxy可以优化vue的数据监听机制问题及实现思路
2018/11/29 Javascript
详解Express笔记之动态渲染HTML(新手入坑)
2018/12/13 Javascript
微信小程序点击图片实现长按预览、保存、识别带参数二维码、转发等功能
2019/07/20 Javascript
vue模块移动组件的实现示例
2020/05/20 Javascript
python使用socket远程连接错误处理方法
2015/04/29 Python
Python异常对代码运行性能的影响实例解析
2018/02/08 Python
Python paramiko模块的使用示例
2018/04/11 Python
Python批量删除只保留最近几天table的代码实例
2019/04/01 Python
django foreignkey外键使用的例子 相当于left join
2019/08/06 Python
使用Python给头像戴上圣诞帽的图像操作过程解析
2019/09/20 Python
Opencv图像处理:如何判断图片里某个颜色值占的比例
2020/06/03 Python
Fox Racing官方网站:越野摩托车和山地自行车装备和服装
2019/12/23 全球购物
当一个对象被当作参数传递到一个方法后,此方法可改变这个对象的属性,并可返回变化后的结果,那么这里到底是值传递还是引用传递?
2014/09/09 面试题
个人考核材料
2014/05/15 职场文书
工程部主管岗位职责
2015/02/12 职场文书
摩登时代观后感
2015/06/03 职场文书
婚宴新娘致辞
2015/07/28 职场文书
python实现过滤敏感词
2021/05/08 Python
pytorch查看网络参数显存占用量等操作
2021/05/12 Python
深入理解Pytorch微调torchvision模型
2021/11/11 Python