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

 更新时间:2019年02月27日 15:50:59   作者:踩坑的土拨鼠  
今天小编就为大家分享一篇关于js获取form表单中name属性的值,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧

在项目中因为动态表单无法确定标签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+CSS实现影像卷帘效果思路及代码

    Javascript+CSS实现影像卷帘效果思路及代码

    Arcmap里面的一个卷帘效果肯定记忆很深刻,我也对这种比较炫的卷帘效果做了一下研究,现在给大家汇报下结果
    2014-10-10
  • 使用javascript实现判断当前浏览器

    使用javascript实现判断当前浏览器

    这篇文章主要介绍了使用javascript实现判断当前浏览器的类型及版本,虽然不是很全面,但是还是推荐给大家,简单学下方法和思路。
    2015-04-04
  • 微信小程序实现商品分类页过程结束

    微信小程序实现商品分类页过程结束

    这篇文章主要为大家详细介绍了微信小程序实现商品分类页列表方法,商品分类页主要是需要实现商品类目和对应商品标题的联动跳转,文中过程详细,感兴趣的小伙伴们可以参考一下
    2023-05-05
  • JavaScript获取时间戳的方法总结

    JavaScript获取时间戳的方法总结

    JavaScript获得时间戳的方法有五种,后四种都是通过实例化时间对象new Date() 来进一步获取当前的时间戳,下面我们就一起学习一下具体获取的方法吧
    2023-09-09
  • 详解JavaScript中的4种类型识别方法

    详解JavaScript中的4种类型识别方法

    JavaScript中检测对象类型的运算符有:typeof、instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一个说明运算数类型的字符串。下面由小编给大家分享JavaScript中的4种类型识别方法,需要的朋友可以参考下本文
    2015-09-09
  • JavaScript实现手风琴效果

    JavaScript实现手风琴效果

    这篇文章主要为大家详细介绍了JavaScript实现手风琴效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-02-02
  • javascript中的altKey 和 Event属性大全

    javascript中的altKey 和 Event属性大全

    本文给大家介绍javascript中的altkey和event属性大全,涉及到altkey和event属性语法定义及用法,本文介绍的非常详细,感兴趣的朋友一起看看吧
    2015-11-11
  • 解决一个微信号同时支持多个环境网页授权问题

    解决一个微信号同时支持多个环境网页授权问题

    由于微信限制一个服务号只能配置一个网页授权域名, 又不可能给每个环境单独配一个服务号,这样不仅需要成本而且很浪费资源,下面小编给大家带来了解决一个微信号同时支持多个环境网页授权问题,感兴趣的朋友一起看看吧
    2019-08-08
  • JS计算输出100元钱买100只鸡问题的解决方法

    JS计算输出100元钱买100只鸡问题的解决方法

    这篇文章主要介绍了JS计算输出100元钱买100只鸡问题的解决方法,简单描述了100元钱买100只鸡问题并结合实例形式分析了问题解决的思路与具体实现方法,需要的朋友可以参考下
    2018-01-01
  • 微信小程序自定义弹框效果

    微信小程序自定义弹框效果

    这篇文章主要为大家详细介绍了微信小程序自定义弹框效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07

最新评论