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 相关文章推荐
推荐30个新鲜出炉的精美 jQuery 效果
Mar 26 Javascript
在javaScript中关于submit和button的区别介绍
Oct 20 Javascript
jquery 无限级下拉菜单的简单实现代码
Feb 21 Javascript
js判断url是否有效的两种方法
Mar 04 Javascript
jquery查找tr td 示例模拟
May 08 Javascript
学习javascript面向对象 掌握创建对象的9种方式
Jan 04 Javascript
js去字符串前后空格的实现方法
Feb 26 Javascript
Javascript设计模式之观察者模式(推荐)
Mar 29 Javascript
AngularJs中Bootstrap3 datetimepicker使用实例
Dec 13 Javascript
layui select动态添加option的实例
Mar 07 Javascript
解决Vue 项目打包后favicon无法正常显示的问题
Sep 01 Javascript
微信小程序云开发之新手环境配置
May 16 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
PHP 在线翻译函数代码
2009/05/07 PHP
PHP操作mysql函数详解,mysql和php交互函数
2011/05/19 PHP
PHP中让curl支持sock5的代码实例
2015/01/21 PHP
phpinfo()中Loaded Configuration File(none)的解决方法
2017/01/16 PHP
PHP实现的超长文本分页显示功能示例
2018/06/04 PHP
在百度知道团队中快速审批新成员的js脚本
2014/02/02 Javascript
JS数字抽奖游戏实现方法
2015/05/04 Javascript
js利用clipboardData实现截屏粘贴功能
2016/10/12 Javascript
AngularJS ng-repeat数组有重复值的解决方法
2016/10/23 Javascript
js控制一个按钮是否可点击(可使用)disabled的实例
2017/02/14 Javascript
JS检测数组类型的方法小结
2017/03/14 Javascript
vue.js单页面应用实例的简单实现
2017/04/10 Javascript
angularjs实现猜数字大小功能
2020/05/20 Javascript
实现div内部滚动条滚动到底部和顶部的代码
2017/11/15 Javascript
vue-cli 组件的导入与使用教程详解
2018/04/11 Javascript
vue.js template模板的使用(仿饿了么布局)
2018/08/13 Javascript
React Ant Design树形表格的复杂增删改操作
2020/11/02 Javascript
python的Template使用指南
2014/09/11 Python
Python中使用hashlib模块处理算法的教程
2015/04/28 Python
python pyheatmap包绘制热力图
2018/11/09 Python
在Python中关于使用os模块遍历目录的实现方法
2019/01/03 Python
python使用sklearn实现决策树的方法示例
2019/09/12 Python
python判断链表是否有环的实例代码
2020/01/31 Python
Python猜数字算法题详解
2020/03/01 Python
python 如何使用find和find_all爬虫、找文本的实现
2020/10/16 Python
基于python模拟bfs和dfs代码实例
2020/11/19 Python
一款基于css3和jquery实现的动画显示弹出层按钮教程
2015/01/04 HTML / CSS
HTML5中div、article、section的区别及使用介绍
2013/08/14 HTML / CSS
使用html5 canvas绘制圆环动效
2019/06/03 HTML / CSS
Moda Italia荷兰:意大利男士服装
2019/08/31 全球购物
监理员的岗位职责
2013/11/13 职场文书
关于打架的检讨书
2014/01/17 职场文书
中学生个人自我评价
2014/02/06 职场文书
《可爱的动物》教学反思
2014/02/22 职场文书
国际贸易专业自荐信
2014/06/10 职场文书
毕业论文答辩演讲稿
2015/06/23 职场文书