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 dataTable 获取某行数据
May 05 jQuery
jQuery扩展_动力节点Java学院整理
Jul 05 jQuery
jQuery remove()过滤被删除的元素(推荐)
Jul 18 jQuery
vue单页应用中如何使用jquery的方法示例
Jul 27 jQuery
JQuery判断正整数整理小结
Aug 21 jQuery
jQuery图片加载失败替换默认图片方法汇总
Nov 29 jQuery
用jquery获取select标签中选中的option值及文本的示例
Jan 25 jQuery
jQuery实现的鼠标响应缓冲动画效果示例
Feb 13 jQuery
jQuery实现上下滚动公告栏详细代码
Nov 21 jQuery
jQuery实现提交表单时不提交隐藏div中input的方法
Oct 08 jQuery
jquery实现拖拽添加元素功能
Dec 01 jQuery
JS实现选项卡插件的两种写法(jQuery和class)
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(4) php 函数 补充2
2010/02/15 PHP
php中一个完整表单处理实现代码
2011/11/10 PHP
PHP遍历并打印指定目录下所有文件实例
2014/02/10 PHP
PHP中Header使用的HTTP协议及常用方法小结
2014/11/04 PHP
php读取和保存base64编码的图片内容
2017/04/22 PHP
PHP实现websocket通信的方法示例
2018/08/28 PHP
javascript 文件的同步加载与异步加载实现原理
2012/12/13 Javascript
Jquery读取URL参数小例子
2013/08/30 Javascript
JavaScript给url网址进行encode编码的方法
2015/03/18 Javascript
JavaScript数组前面插入元素的方法
2015/04/06 Javascript
JavaScript框架是什么?怎样才能叫做框架?
2015/07/01 Javascript
javascript弹出窗口实现代码
2015/11/12 Javascript
详述JavaScript实现继承的几种方式(推荐)
2016/03/22 Javascript
原生js编写autoComplete插件
2016/04/13 Javascript
json实现添加、遍历与删除属性的方法
2016/06/17 Javascript
微信小程序之picker日期和时间选择器
2017/02/09 Javascript
angularJS之$http:与服务器交互示例
2017/03/17 Javascript
vue实现单选和多选功能
2017/08/11 Javascript
vue.js移动数组位置,同时更新视图的方法
2018/03/08 Javascript
使用jquery Ajax实现上传附件功能
2018/10/23 jQuery
ElementUI radio组件选中小改造
2019/08/12 Javascript
layui在form表单页面通过Validform加入简单验证的方法
2019/09/06 Javascript
Python版的文曲星猜数字游戏代码
2013/09/02 Python
剖析Python的Twisted框架的核心特性
2016/05/25 Python
python itchat实现微信自动回复的示例代码
2017/08/14 Python
用Python将一个列表分割成小列表的实例讲解
2018/07/02 Python
django 实现后台从富文本提取纯文本
2020/07/02 Python
python matlab库简单用法讲解
2020/12/31 Python
html5超简单的localStorage实现记住密码的功能实现
2017/09/07 HTML / CSS
Missguided美国官网:英国时尚品牌
2018/01/18 全球购物
法人委托书范本
2014/04/04 职场文书
清明节网上祭英烈活动总结
2014/04/30 职场文书
商务日语专业的自荐信
2014/05/23 职场文书
2016党员读书思廉心得体会
2016/01/23 职场文书
让文件路径提取变得更简单的Python Path库
2021/05/27 Python
JS前端使用canvas实现扩展物体类和事件派发
2022/08/05 Javascript