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 Masonry瀑布流布局神器使用详解
May 25 jQuery
vue单页应用中如何使用jquery的方法示例
Jul 27 jQuery
jQuery 中msgTips 顶部弹窗效果实现代码
Aug 14 jQuery
jQuery的时间datetime控件在AngularJs中的使用实例(分享)
Aug 17 jQuery
jquery之基本选择器practice(实例讲解)
Sep 30 jQuery
jQuery简单实现向列表动态添加新元素的方法示例
Dec 25 jQuery
jQuery代码优化方法总结
Jan 29 jQuery
jQuery niceScroll滚动条错位问题的解决方法
Feb 03 jQuery
jQuery获取随机颜色的实例代码
May 21 jQuery
html+jQuery实现拖动滑块图片拼图验证码插件【移动端适用】
Sep 10 jQuery
jQuery-App输入框实现实时搜索
Nov 19 jQuery
ajax jquery实现页面某一个div的刷新效果
Mar 04 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 smarty截取中文字符乱码问题?gb2312/utf-8
2011/11/07 PHP
PHP函数eval()介绍和使用示例
2014/08/20 PHP
php源码 fsockopen获取网页内容实例详解
2016/09/24 PHP
PHP实现mysqli批量执行多条语句的方法示例
2017/07/22 PHP
Laravel框架实现model层的增删改查(CURD)操作示例
2018/05/12 PHP
JavaScript 学习笔记(七)字符串的连接
2009/12/31 Javascript
jquery操作cookie插件分享
2014/01/14 Javascript
javascript基于HTML5 canvas制作画箭头组件
2014/06/25 Javascript
JavaScript针对网页节点的增删改查用法实例
2015/02/02 Javascript
JS onkeypress兼容性写法详解
2016/04/27 Javascript
JS+Canvas绘制时钟效果
2020/08/20 Javascript
JavaScript 中有关数组对象的方法(详解)
2016/08/15 Javascript
js eval函数使用,js对象和字符串互转实例
2017/03/06 Javascript
js实现首屏延迟加载实现方法 js实现多屏单张图片延迟加载效果
2017/07/17 Javascript
Node.js 基础教程之全局对象
2017/08/06 Javascript
详解Angular5 服务端渲染实战
2018/01/04 Javascript
vue开发环境配置跨域的方法步骤
2019/01/16 Javascript
微信小程序在ios下Echarts图表不能滑动的问题解决
2019/07/10 Javascript
使用localStorage替代cookie做本地存储
2019/09/25 Javascript
Vue中this.$nextTick的作用及用法
2020/02/04 Javascript
解决Vue-Router升级导致的Uncaught (in promise)问题
2020/08/07 Javascript
用Python进行基础的函数式编程的教程
2015/03/31 Python
详解django中url路由配置及渲染方式
2019/02/25 Python
用Python获取摄像头并实时控制人脸的实现示例
2019/07/11 Python
利用CSS3实现单选框动画特效示例代码
2016/09/26 HTML / CSS
美国领先的商务贺卡出版商:The Gallery Collection
2018/02/13 全球购物
台湾SHOPRO购物行家:亚洲首创影视.3C.家电.优质购物平台
2018/05/07 全球购物
校园奶茶店创业计划书
2014/01/23 职场文书
一位农村小子的自荐信
2014/04/07 职场文书
2014年施工员工作总结
2014/11/18 职场文书
高中生综合素质评价范文
2015/08/18 职场文书
七年级之开学家长寄语35句
2019/09/05 职场文书
python基于tkinter实现gif录屏功能
2021/05/19 Python
只用20行Python代码实现屏幕录制功能
2021/06/02 Python
Vue操作Storage本地化存储
2022/04/29 Vue.js
MYSQL常用函数介绍
2022/05/05 MySQL