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获取radio选中的值
May 05 jQuery
jQuery实现frame之间互通的方法
Jun 26 jQuery
jQuery动画_动力节点节点Java学院整理
Jul 04 jQuery
jQuery扇形定时器插件pietimer使用方法详解
Jul 18 jQuery
jQuery插件DataTables分页开发心得体会
Aug 22 jQuery
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 jQuery
jQuery实现切换隐藏与显示同时切换图标功能
Oct 29 jQuery
jQuery 点击获取验证码按钮及倒计时功能
Sep 20 jQuery
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
Oct 26 jQuery
jQuery表单元素过滤选择器用法实例分析
Feb 20 jQuery
浅谈JS和jQuery的区别
Mar 27 jQuery
jQuery 添加元素和删除元素的方法
Jul 15 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
如何跨站抓取别的站点的页面的补充
2006/10/09 PHP
php报表之jpgraph柱状图实例代码
2011/08/22 PHP
PHP设计模式之装饰者模式
2012/02/29 PHP
PHP中time(),date(),mktime()区别介绍
2013/09/28 PHP
php环境下利用session防止页面重复刷新的具体实现
2014/01/09 PHP
PHP中余数、取余的妙用
2015/06/29 PHP
Laravel框架路由和控制器的绑定操作方法
2018/06/12 PHP
php微信公众号开发之答题连闯三关
2018/10/20 PHP
js 设置选中行的样式的实现代码
2010/05/24 Javascript
使用非html5实现js板连连看游戏示例代码
2013/09/22 Javascript
JQuery控制radio选中和不选中方法总结
2015/04/15 Javascript
js 截取或者替换字符串中的数字实现方法
2016/06/13 Javascript
微信小程序 解决swiper不显示图片的方法
2017/01/04 Javascript
Bootstrap 响应式实用工具实例详解
2017/03/29 Javascript
JavaScript学习总结之正则的元字符和一些简单的应用
2017/06/30 Javascript
对vuejs的v-for遍历、v-bind动态改变值、v-if进行判断的实例讲解
2018/08/27 Javascript
JavaScript 对引擎、运行时、调用堆栈的概述理解
2018/10/22 Javascript
Vue组件Draggable实现拖拽功能
2018/12/01 Javascript
JS数组的常用10种方法详解
2020/05/08 Javascript
[02:28]DOTA2 2017国际邀请赛小组赛回顾
2017/08/09 DOTA
Python学习笔记(一)(基础入门之环境搭建)
2014/06/05 Python
Python时间模块datetime、time、calendar的使用方法
2016/01/13 Python
Django REST为文件属性输出完整URL的方法
2017/12/18 Python
python爬取网页内容转换为PDF文件
2020/07/28 Python
Python统计学一数据的概括性度量详解
2020/03/03 Python
python将音频进行变速的操作方法
2020/04/08 Python
Pytorch 高效使用GPU的操作
2020/06/27 Python
总结html5自定义属性有哪些
2020/04/01 HTML / CSS
Lulu & Georgia官方网站:购买地毯、家具、抱枕、壁纸、床上用品等
2018/03/19 全球购物
英国在线滑雪板和冲浪商店:The Board Basement
2020/01/11 全球购物
物流专业求职计划书
2014/01/10 职场文书
应届生面试求职信
2014/07/02 职场文书
安全例会汇报材料
2014/08/23 职场文书
党在我心中演讲稿
2014/09/02 职场文书
批评与自我批评范文
2014/10/15 职场文书
工程技术负责人岗位职责
2015/04/13 职场文书