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实现静态搜索功能(可输入搜索文字)
Mar 28 jQuery
jQuery实现所有验证通过方可提交的表单验证
Nov 21 jQuery
JQuery Ajax动态加载Table数据的实例讲解
Aug 09 jQuery
jquery使用FormData实现异步上传文件
Oct 25 jQuery
jQuery实现的3D版图片轮播示例【滑动轮播】
Jan 18 jQuery
jQuery对底部导航进行跳转并高亮显示的实例代码
Apr 23 jQuery
JQuery常见节点操作实例分析
May 15 jQuery
jQuery pager.js 插件动态分页功能实例分析
Aug 02 jQuery
javascript(基于jQuery)实现鼠标获取选中的文字示例【测试可用】
Oct 26 jQuery
jQuery Raty星级评分插件使用方法实例分析
Nov 25 jQuery
jquery实现弹窗(系统提示框)效果
Dec 10 jQuery
jQuery实现简单轮播图效果
Dec 27 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学习之PHP表达式
2006/10/09 PHP
php 获取今日、昨日、上周、本月的起始时间戳和结束时间戳的方法
2013/09/28 PHP
linux下安装php的memcached客户端
2014/08/03 PHP
Javascript 代码也可以变得优美的实现方法
2009/06/22 Javascript
js 变量类型转换常用函数与代码[比较全]
2009/12/01 Javascript
类似GMAIL的Ajax信息反馈显示
2010/02/16 Javascript
js Date自定义函数 延迟脚本执行
2010/03/10 Javascript
JQuery触发事件例如click
2013/09/11 Javascript
jquery validate表单验证的基本用法入门
2016/01/18 Javascript
基于Bootstrap实现图片轮播效果
2016/05/22 Javascript
使用do...while的方法输入一个月中所有的周日(实例代码)
2016/07/22 Javascript
Vue.js实现简单动态数据处理
2017/02/13 Javascript
简单的JS控制button颜色随点击更改的实现方法
2017/04/17 Javascript
JS实现访问DOM对象指定节点的方法示例
2018/04/04 Javascript
iview通过Dropdown(下拉菜单)实现的右键菜单
2018/10/26 Javascript
优雅的处理vue项目异常实战记录
2019/06/05 Javascript
微信小程序项目总结之记账小程序功能的实现(包括后端)
2019/08/20 Javascript
element实现合并单元格通用方法
2019/11/13 Javascript
微信小程序实现列表滚动头部吸顶的示例代码
2020/07/12 Javascript
详解如何使用Python编写vim插件
2017/11/28 Python
浅谈Django自定义模板标签template_tags的用处
2017/12/20 Python
Python3多线程爬虫实例讲解代码
2018/01/05 Python
python版微信跳一跳游戏辅助
2018/01/11 Python
HTML的form表单和django的form表单
2019/07/25 Python
详解Ubuntu环境下部署Django+uwsgi+nginx总结
2020/04/02 Python
Django ForeignKey与数据库的FOREIGN KEY约束详解
2020/05/20 Python
Python DES加密实现原理及实例解析
2020/07/17 Python
.net开发工程师面试题
2014/02/25 面试题
上海雨人软件技术开发有限公司测试题
2015/07/14 面试题
酒店总经理欢迎词
2014/01/15 职场文书
九寨沟导游词
2015/02/02 职场文书
消费者理赔投诉书
2015/07/02 职场文书
优秀志愿者感言
2015/08/01 职场文书
css3 filter属性的使用简介
2021/03/31 HTML / CSS
MySQL中的隐藏列的具体查看
2021/09/04 MySQL
IDEA 2022 Translation 未知错误 翻译文档失败
2022/04/24 Java/Android