在HTML中从多选下拉框中提取已选中选项的文本内容到后台,被这个问题难倒了。

demo.jsp文件


  1. <select id="selecttype" name"type">
  2. <option value="" selected="selected">请选择</option>
  3. <c:forEach items="${typeList}" var="typeList">
  4. <option value="${typeList.id}">${typeList.name}</option>
  5. <c:forEach>
  6. </select>

如上代码,想过用设置隐藏域获取文本内容typeList.name,将隐藏域放在forEach循环内。

<input id="selecttypename" type="hidden" name="typename" value="${typeList.name}" />

后台接收typename为空值,也许遍历循环的时候把隐藏域也循环出多份了,而同一个Form表单中不能有多个相同name属性的标签。

隐藏域放哪里好呢?思考无果后开始查资料,最后找到解决方案。

JavaScript中有一个change事件

JavaScript代码


  1. $("#selecttype").change(function(){
  2. $("selecttypename").val($("#selecttype").find("option:selected").text());
  3. });

当触发select框选项改变的条件,将框内选中的文本内容传递给隐藏域的value值,这样隐藏域也能随自己心意放在合适的位置了。

关于java 获取 html select标签 下拉框 option 文本内容 隐藏域的更多相关文章

  1. JavaScript获取Select下拉框Option的Value和Text值的方法

    Js获取select下拉列表框各个Option的Value值相对比较容易,不过获取Text值却有点麻烦,对于一个初学JavaScript的 新手来说,可能一时还无从下手,那么就请看下本文的方法,以一个 ...

  2. JavaScript解决select下拉框中的内容太长显示不全的问题

    JavaScript解决select下拉框中的内容太长显示不全的问题 1.说明 有些情况下,select下拉框的内容过长,导致部分看不见: 现在通过鼠标事件,让下拉框中的内容显示完全 2.实现源码 & ...

  3. select change下拉框改变事件 设置选定项,禁用select

    select change下拉框改变事件 设置选定项,禁用select 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio ...

  4. Vue.js中使用select选择下拉框

    在Vue.js中使用select选择下拉框有两种方法: 第一种: Add.html: <select v-model="sysNotice.noticeType" id=&q ...

  5. selenium select 选择下拉框

    实战百度首页设置,浏览偏好设置. 打开首页,在非登录的情况下,查看分析页面元素,我们可以看到,我们首先要点击的是设置, 接着点击,搜索设置, 然后select选择下拉框. select_by_inde ...

  6. 【selenium】基于python语言,如何用select选择下拉框

    在项目测试中遇到了下拉框选择的控件,来总结下如何使用select选择下拉框: 下图是Select类的初始化描述,意思是,给定元素是得是select类型,不是就抛异常.接下来给了例子:要操作这个sele ...

  7. jq select change下拉框选项变化判断选中值,添加(attr)或移除(removeAttr)一个或多个属性

    select change下拉框选项变化判断选中值,添加(attr)或移除(removeAttr)一个或多个属性 $("#IsRecommend").change(function ...

  8. JavaScript下拉框去除重复内容

    下拉框去除重复内容 <script type="text/javascript" src="http://www.joleye.com/libraries/java ...

  9. Selenium常用API用法示例集----下拉框、文本域及富文本框、弹窗、JS、frame、文件上传和下载

    元素识别方法.一组元素定位.鼠标操作.多窗口处理.下拉框.文本域及富文本框.弹窗.JS.frame.文件上传和下载 元素识别方法: driver.find_element_by_id() driver ...

随机推荐

  1. python 中如何计算时间差...

    Q:如何方便的计算两个时间的差,如两个时间相差几天,几小时等 A:使用datetime模块可以很方便的解决这个问题,举例如下: >>> import datetime>> ...

  2. OOP 1.5 类和对象的基本概念与用法1

    1.定义 面向对象的基本特点:抽象.封装.继承.多态 面向对象程序设计方法:将某类客观事物的共同特点归纳出来,形成一个数据结构 抽象:将事物所能进行的行为归纳出来,形成一个个函数,这些函数可以用来操作 ...

  3. hdu1010--Tempter of the Bone(迷宫)

    题目链接http://acm.hdu.edu.cn/showproblem.php?pid=1010 Tempter of the Bone Time Limit: 2000/1000 MS (Jav ...

  4. Jquery获取属性值

    jq获取某个标签内的属性值:$("#TeamPerformanceYearUl li:eq(0)").attr('data') jq获取li或者td第一个属性(索引值从零开始)$( ...

  5. Google Professional Data Engineer(PDE)考试

    在国内参加PDE考试的人比较少,导致资料也很少.我在19年1月30号去上海参加PDE考试,参加前也是完全没底,因为时间短资料少,但幸运的是顺利通过了.回过头来看,其中有些技巧和重点,在此做一些总结,希 ...

  6. js实现轮播功能

    先上图,效果大概就是这样子: 实现的功能: 1.鼠标经过第几个正方形,就要展示第几张图片,并且正方形的颜色也发生变化 2.图片自动轮播,(这需要一个定时器) 3.鼠标经过图片,图片停止自动播放(这需要 ...

  7. js登录界面代码自用

    var btn = document.getElementById("a4"); var usne = document.getElementById("username ...

  8. (十三)Jmeter之Bean Shell 的使用(二)

    该文章来自:http://www.cnblogs.com/puresoul/p/5092628.html 上一篇Jmeter之Bean shell使用(一)简单介绍了下Jmeter中的Bean she ...

  9. fsocket发送post实现异步请求

    function triggerRequest($url, $post_data = array(), $cookie = array()){ //可以通过POST或者GET传递一些参数给要触发的脚本 ...

  10. 微信小程序 功能函数 touch触摸计时

    shiFN:function(e){ // touchstart // touchend let that=this; let n=0; // 判断是开始还是结束的参数 let textTure = ...