js获取form表单中name属性的值


Posted in Javascript onFebruary 27, 2019

在项目中因为动态表单无法确定标签name属性的值,因此需要即时获取以便进行存储。前端代码如下:

<div class="control-group">
<label class="control-label">土拨鼠常挖坑</label>
<form:input path="formAttribute1" class="input-xlarge" value="" name="测试1"/></div>
<form:input path="formAttribute1" class="input-xlarge" value="" name="测试2"/></div>
<form:input path="formAttribute1" class="input-xlarge" value="" name="测试3"/></div>

1、attr:$("#formAttribute1").attr("name");然后得到的值是formAttribute1(有没有前辈能给我讲讲为什么呀)

2、prop:问题同上

3、在上述两种方式都失败后,整个人不行了。最后找到了一个相对可行的方式,对class属性做修改,获取全部值,然后通过<c:foreach>标签获取this.value  和this.name,并放入map中。具体操作可参考如下代码(与上面代码区别在于class属性,在此处添加了property作为标识,此处可自定义名称)

<div class="control-group">
<label class="control-label">土拨鼠常挖坑</label>
<form:input path="formAttribute1" class="input-xlarge property" value="" name="测试1"/></div>
<form:input path="formAttribute1" class="input-xlarge property" value="" name="测试2"/></div>
<form:input path="formAttribute1" class="input-xlarge property" value="" name="测试3"/></div>

JS方法如下:

<script type="text/javascript">
   $("#btnSubmit").on("click",function () { //事件绑定btnSubmit是信息填写完毕提交处的按键
     var propertyMap= {};
     $(".property").each(function () {
       propertyMap[this.name] = this.value;
     });
    var propertyInfo= JSON.stringify(propertyMap);
     alert($("#propertyInfo")
   });
 </script>

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Javascript 相关文章推荐
jQuery删除一个元素后淡出效果展示删除过程的方法
Mar 18 Javascript
JavaScript 过滤关键字
Mar 20 Javascript
Webpack中css-loader和less-loader的使用教程
Apr 27 Javascript
Bootstrap 表单验证formValidation 实现表单动态验证功能
May 17 Javascript
简单谈谈require模块化jquery和angular的问题
Jun 23 jQuery
Vue-Router进阶之滚动行为详解
Sep 13 Javascript
JS+HTML5 Canvas实现简单的写字板功能示例
Aug 30 Javascript
如何去除富文本中的html标签及vue、react、微信小程序中的过滤器
Nov 21 Javascript
Vue中的transition封装组件的实现方法
Aug 13 Javascript
vue-froala-wysiwyg 富文本编辑器功能
Sep 19 Javascript
简单使用webpack打包文件的实现
Oct 29 Javascript
如何阻止移动端浏览器点击图片浏览
Aug 29 Javascript
用VueJS写一个Chrome浏览器插件的实现方法
Feb 27 #Javascript
jQuery each和js forEach用法比较
Feb 27 #jQuery
JavaScript遍历数组的三种方法map、forEach与filter实例详解
Feb 27 #Javascript
Vue CLI 2.x搭建vue(目录最全分析)
Feb 27 #Javascript
JavaScript中filter的用法实例分析
Feb 27 #Javascript
jQuery中each和js中forEach的区别分析
Feb 27 #jQuery
简单了解node npm cnpm的具体使用方法
Feb 27 #Javascript
You might like
destoon在各个服务器下设置URL Rewrite(伪静态)的方法
2014/06/21 Servers
php制作的简单验证码识别代码
2016/01/26 PHP
PHP脚本自动识别验证码查询汽车违章
2016/12/20 PHP
js 对联广告、漂浮广告封装类(IE,FF,Opera,Safari,Chrome
2009/11/26 Javascript
DOM基础教程之使用DOM + Css
2015/01/20 Javascript
JavaScript数组对象实现增加一个返回随机元素的方法
2015/07/27 Javascript
JS实现css hover操作的方法示例
2017/04/07 Javascript
关于vue-router路径计算问题
2017/05/10 Javascript
Ionic + Angular.js实现图片轮播的方法示例
2017/05/21 Javascript
JS中去掉array中重复元素的方法
2017/05/26 Javascript
基于JavaScript实现带数据验证和复选框的表单提交
2017/08/23 Javascript
利用js实现前后台传送Json的示例代码
2018/03/29 Javascript
详解Javascript中new()到底做了些什么?
2018/03/29 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
2018/08/31 Javascript
解决IE11 vue +webpack 项目中数据更新后页面没有刷新的问题
2018/09/25 Javascript
React手稿之 React-Saga的详解
2018/11/12 Javascript
[46:49]完美世界DOTA2联赛PWL S3 access vs Rebirth 第二场 12.19
2020/12/24 DOTA
详解Python中列表和元祖的使用方法
2015/04/25 Python
python使用筛选法计算小于给定数字的所有素数
2018/03/19 Python
浅谈Scrapy网络爬虫框架的工作原理和数据采集
2019/02/07 Python
解决pycharm运行程序出现卡住scanning files to index索引的问题
2019/06/27 Python
python画图--输出指定像素点的颜色值方法
2019/07/03 Python
python并发编程多进程之守护进程原理解析
2019/08/20 Python
Python如何访问字符串中的值
2020/02/09 Python
matlab中imadjust函数的作用及应用举例
2020/02/27 Python
Django路由层URLconf作用及原理解析
2020/09/24 Python
Python在centos7.6上安装python3.9的详细教程(默认python版本为2.7.5)
2020/10/15 Python
Holland & Barrett爱尔兰:英国领先的健康零售商
2019/03/31 全球购物
小学生防溺水广播稿
2014/01/12 职场文书
《绿色蝈蝈》教学反思
2014/03/02 职场文书
同意迁入证明模板
2014/10/26 职场文书
惹女朋友生气检讨书
2015/05/06 职场文书
2019最新企业员工考勤管理制度(通用版)!
2019/07/02 职场文书
Django展示可视化图表的多种方式
2021/04/08 Python
微信小程序实现拍照和相册选取图片
2021/05/09 Javascript
图解排序算法之希尔排序Java实现
2021/06/26 Java/Android