问：
一个页面里有个复选select 因为option是动态变化的
我想在提交后得到这个select里所有option的value
<select multiple name=test>
   <option value=1>1</option>
<option value=2>2</option>
</select>
不管是否选中
那位能告诉我怎么做
______________________________________________________________________________________________
答1：
var o = document.formName.test
s="
for(i=0;i<o.options.length;i++){
s+=o.options[i].text+":"
if(o.options[i].selected) alert(o.options[i].text)
}
alert(s)
______________________________________________________________________________________________
答2：
最好别用test做名字，会有错的
______________________________________________________________________________________________
答3：
提交后要想得到所有的value
必须在提交之前把所有option置为选中

listLength = Frm.selectOperPoint.options.length;
for(i=0;i<listLength;i++)
{
      Frm.selectOperPoint.options[i].selected = true;
}
______________________________________________________________________________________________
答4：
这个语句只能在test所在的页面使用吧，我要在提交后的页面得到结果
______________________________________________________________________________________________
答5：
我向做的是个就业系统，里面有个就业地点选择，这个是多选的，是由另外一个多选select
点击到另外一个复选select的，我里面有个功能就是移除所选中的option
我想提交后能得到所有option的值，因为一个option代表一个用户愿意工作的地点
______________________________________________________________________________________________
答6：
我看网易的就业系统就是这样做的 ，但是我不知道他那个怎么处理提交后的数据，把用户选中地点存到数据库，我想他应该是得到了所有option的值，而且我试了，他是你不管是否选中，都能得到所有的值
______________________________________________________________________________________________
答7：
<html>
<script language="javascript">
function btnClick()
{
var i
var s=""
for(i=0;i<document.all.item("num").length;i++)
{
  s=s+document.all.item("num").options[i].value+","
  alert(s)
}

document.all.item("result").value=s
alert(
"s="+document.all.item("result").value)
document.all.item("fmSel").submit
}
</script>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 1</title>
</head>

<body>
<form name=fmSel action"">
<select name=num size=1 ><option value=1>1</option><option value=2>2</option></select>
<input type=hidden name=result value="">
<input type=button name=btn value=click οnclick="btnClick();">
</form>
</body>

</html>

______________________________________________________________________________________________
答8：
options[i].text
______________________________________________________________________________________________
答9：
option 操作的例子
htm
<html>
<head>
<style type="text/css">
TABLE {
 width:100%;
}
TD {
 text-align:center;
}
SELECT {
 behavior:url("list.htc");width:100px;height:200px;
}
INPUT {
 behavior:url("list.htc")
}
</style>
</head>
<body>
<table>
 <tr>
  <td colspan="3">删除移动的项、检查重复项、按照value排序（从小到大）</td>
 </tr>
 </tr>
  <td>
   <select id="aaa" multiple ref="bbb" order="value" deleted check>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
   </select>
  </td>
  <td>
   <input type="button" value="全部选择" ref="aaa" selectall><br>
   <input type="button" value="    > >    " ref="aaa"><br>
   <input type="button" value="    < <    " ref="bbb"><br>
   <input type="button" value="全部取消" ref="bbb" selectall><br>
  </td>
  <td>
   <select id="bbb" multiple ref="aaa" order="value" deleted check>
    <option value="7">7</option>
   </select>
  </td>
 </tr>
</table>
<hr>
<table>
 <tr>
  <td colspan="3">不删除移动的项、不检查重复项、按照ord倒序（从大到小）</td>
 </tr>
 </tr>
  <td>
   <select id="ccc" multiple ref="ddd" order="ord" desc>
    <option value="1" ord="1">1</option>
    <option value="2" ord="5">2</option>
    <option value="3" ord="2">3</option>
    <option value="4" ord="6">4</option>
    <option value="5" ord="3">5</option>
    <option value="6" ord="7">6</option>
   </select>
  </td>
  <td>
   <input type="button" value="全部选择" ref="ccc" selectall><br>
   <input type="button" value="    > >    " ref="ccc"><br>
   <input type="button" value="    < <    " ref="ddd"><br>
   <input type="button" value="全部取消" ref="ddd" selectall><br>
  </td>
  <td>
   <select id="ddd" multiple ref="ccc" order="ord" desc>
    <option value="7" ord="4">7</option>
   </select>
  </td>
 </tr>
</table>
<hr>
<table>
 <tr>
  <td colspan="3">不删除移动的项、检查重复项、按照ord倒序（从大到小）</td>
 </tr>
 </tr>
  <td>
   <select id="eee" multiple ref="fff" order="ord" desc check>
    <option value="1" ord="1">1</option>
    <option value="2" ord="5">2</option>
    <option value="3" ord="2">3</option>
    <option value="4" ord="6">4</option>
    <option value="5" ord="3">5</option>
    <option value="6" ord="7">6</option>
   </select>
  </td>
  <td>
   <input type="button" value="全部选择" ref="eee" selectall><br>
   <input type="button" value="    > >    " ref="eee"><br>
   <input type="button" value="    < <    " ref="fff"><br>
   <input type="button" value="全部取消" ref="fff" selectall><br>
   <input type="button" value="选中左边列表所有的项" οnclick="eee.selectAll()"><br>
   <input type="button" value="取消左边列表中选中的项" οnclick="eee.selectNone()"><br>
   <input type="button" value="删除左边列表中选中的项" οnclick="eee.deleted()"><br>
  </td>
  <td>
   <select id="fff" multiple ref="eee" order="ord" desc check>
    <option value="7" ord="4">7</option>
   </select>
  </td>
 </tr>
</table>
</body>
</html>

______________________________________________________________________________________________
答10：
list.htc

//删除所有选中的项
<PUBLIC:METHOD NAME="deleted" />
//选中所有项
<PUBLIC:METHOD NAME="selectAll" />
//取消选中的项
<PUBLIC:METHOD NAME="selectNone" />
<PUBLIC:ATTACH EVENT="onclick" ONEVENT="doClick()" />
<PUBLIC:ATTACH EVENT="ondblclick"  ONEVENT="doDblClick()" />
<script language="JScript">
//从列表框中删除所有选中的项。如果obj为null，则列表框为自身。
function deleted(obj) {
 if (obj == null) obj = element;
 if (obj.tagName != "SELECT") return;
 for (var i=obj.options.length-1;i>=0;i--) {
  if (obj.options[i].selected) {
   obj.options.remove(i);
  }
 }
}
//选中给定的列表框中所有的项。如果obj为null，则列表框为自身。
function selectAll(obj) {
 if (obj == null) obj = element;
 if (obj.tagName != "SELECT") return;
 var length = obj.options.length;
 for (var i=0;i<length;i++) {
  obj.options[i].selected = true;
 }
}
//取消给定的列表框中所有选中的项。如果obj为null，则列表框为自身。
function selectNone(obj) {
 if (obj == null) obj = element;
 if (obj.tagName != "SELECT") return;
 var length = obj.options.length;
 for (var i=0;i<length;i++) {
  obj.options[i].selected = false;
 }
}
//检查obj列表框中是否已经存在选项opt
function optionExists(obj,opt) {
 var length = obj.options.length;
 for (var i=0;i<length;i++) {
  if (obj.options[i].text == opt.text && obj.options[i].value == opt.value) //如果一个选项的值和文本与给定的选项相同，则表明存在。
   return true;
 }
 return false; //如果不存在，则返回false
}
//将列表框obj1中选中的项添加到obj2列表框中，check=true表示不向obj2中的添加重复项
function add(obj1,obj2,check) {
 for (var i=0;i<obj1.options.length;i++) {
  if (obj1.options[i].selected) {  //如果选项被选中，则需要加入到obj2中。
   if (check) { //需要进行重复性检查
    if (optionExists(obj2,obj1.options[i])) { //如果obj2列表框中存在指定的选项，进行下一个循环
     continue;
    }
   }
   var opt = obj1.options[i].cloneNode(false);
   opt.text = obj1.options[i].text;
   obj2.options.add(opt);  //将选项加入到ojb2中。
  }
 }
}
//排序，obj为列表框对象，order为排序属性，desc为是否倒序(true-倒序)，采用冒泡算法的改进算法
function orderList(obj,order,desc) {
 var chg = null;
 var flag = true; //是否进行过交换的标志
 var m = null;
 var n = null;
 var len = obj.options.length - 1;
 for (var j=len;j>0;j--) {
  flag = true;
  for (var k=0;k<j;k++) {
   eval("m = parseFloat(obj.options[k]." + order + ");");
   eval("n = parseFloat(obj.options[k+1]." + order + ");");
   if (desc) {  //如果是倒序排列，则交换m和n
    var tt = m;
    m = n;
    n = tt;
   }
   if (m > n) { //如果m > n 交换两个选项
    chg = obj.options[k].cloneNode(false);
    chg.text = obj.options[k].text;
    obj.options[k] = obj.options[k+1].cloneNode(false);
    obj.options[k].text = obj.options[k+1].text;
    obj.options[k+1] = chg.cloneNode(false);
    obj.options[k+1].text = chg.text;
    flag = false;  //交换过，设为false
   }
  }
  if (flag) break;  //如果一次都没有交还，则退出
 }
}
//事件处理
function doEvent() {
 var obj1 = null;  //列表框1变量
 if (window.event.srcElement.tagName == "SELECT") { //如果触发元素是select
  obj1 = window.event.srcElement;  //obj为触发的select
 }
 else if (window.event.srcElement.tagName == "OPTION") { //如果触发元素是option
  obj1 = window.event.srcElement.parentElement;  //obj为触发元素的父元素select
 }
 else {
  if (typeof(window.event.srcElement.ref) != "undefined") { //如果ref被定义过
   obj1 = window.document.getElementById(window.event.srcElement.ref); //obj为定义的元素。
   if (obj1 == null) return;
  }
  else
   return;
 }
 if (obj1 == null) return;  //如果obj为空，直接返回。
 if (obj1.tagName != "SELECT") return; //如果返回的obj不是列表框，直接返回。
 if (typeof(obj1.ref) == "undefined") return;  //没有指定目的列表框，直接返回。
 var obj2 = window.document.getElementById(obj1.ref);
 if (obj2 == null) return; //没有找到目的列表框，直接返回
 if (obj2.tagName != "SELECT") return; //指定的目的不是列表框，返回。
 if (typeof(window.event.srcElement.selectall) != "undefined") {  //如果定义了全部选择
  selectAll(obj1);
 }
 var check = (typeof(obj2.check) != "undefined") ? true : false;  //判断是否定义了检查重复项
 add(obj1,obj2,check);  //在ojb2中添加obj1中选中的项。
 if (typeof(obj1.deleted) != "undefined") { //如果定义了删除原项
  deleted(obj1);  //删除原项
 }
 if (typeof(obj2.order) != "undefined") {  //指定需要排序
  var order = obj2.order;
  var desc = (typeof(obj2.desc) == "undefined") ? false : true;  //判断是否定义了倒序
  orderList(obj2,order,desc);  //排序
 }
}
//处理单击事件
function doClick() {
 if (window.event.srcElement.tagName == "SELECT" || window.event.srcElement.tagName == "OPTION") return;
 doEvent();
}
//处理双击事件
function doDblClick() {
 doEvent();
}
</script>

怎样得到select所有option里的值相关推荐

  1. js 得到select所有option里的值

    1://取得所有的option个数 document.getElementById('---').options.length 2://取得每个option的ID值 document.getEleme ...

  2. js 获取 select的option的 id值

    <select > <option value="">--请选择--</option><option id="1" v ...

  3. jquery操作select下拉框的各种方法，获取选中项的值或文本，根据指定的值或文本选中select的option项等...

    简介jquery里对select进行各种操作的方法,如联动.取值.根据值或文本来选中指定的select下拉框指定的option选项,读取select选中项的值和文本等. 这一章,站长总结一下jquer ...

  4. html表单中动态添加下拉框,antd Select下拉菜单动态添加option里的内容操作

    antd Select下拉菜单动态添加option里的内容,通过form表单绑定select选中的值 提供一个公共的方法,每次只需去调用这个方法就行了 //这里是示例数据格式 let giftScop ...

  5. layui select框动态展示option与拿值

    真是我写到吐血才写出来的,分享给你们,希望有所帮助: 照例先看样式: 这里展示的小红和小明是数据库里的, 这是页面上layui jsp的代码 <div class="layui-for ...

  6. 点击select下拉框获取option的属性值

    select下拉框作为前端开发者应该是经常使用的,最近在项目中遇到这样的情况,点击下拉框选项,需要获取所点击的option的属性值,当时想很简单啊,给option加一个点击事件不就行了,然后就加了一下 ...

  7. 关于Angular中使用HTML的select和option标签的一些问题

    如果在Angular中使用HTML的select和option标签时,给两个标签分别绑定数据的时候,虽然可以通过[ngModel]和(ngModelChange)的形式绑定数值及选项变化后触发的事件. ...

  8. js 多选框被选中触发的事件_JS实现select选中option触发事件操作示例

    本文实例讲述了JS实现select选中option触发事件操作.分享给大家供大家参考,具体如下: 我们在用到下拉列表框select时,需要对选中的选项触发事件,其实本身没有触发事件方法,我们只有在se ...

  9. html 中的下拉列表,【HTML】什么是 HTML 中的下拉列表（select、option）

    我们以英雄联盟大区服务器状态查询网站里的"下拉选择服务器状态"为例,先来看一下,什么是下拉列表,浏览器运行效果如下所示这就是下拉列表用到的地方之一,接下来我们就来学习一下HTML中 ...

最新文章

  1. 【内推】滴滴出行视觉计算组招聘算法实习生
  2. python coroutine_笔记-python-coroutine
  3. java参数传入泛型类型_Java 泛型（参数化类型）
  4. 复盘从一个监控主机到核心路由沦陷
  5. 我如何吸引Elastic创始人一起对高并发写入进行优化？
  6. java(线程特性,Volatile作用，java内存模型)
  7. php.ini 开启zend,php之ZendFramewor篇（1）application.ini配置说明
  8. 基于Java的外卖订餐平台
  9. dts双轨制会员积分系统
  10. hadoop面试题汇总
  11. 烽火戏诸侯暂排第四，第四届橙瓜网络文学奖入围20年十佳仙侠大神
  12. Windows 10免费影音制作下载（Windows Movie Maker 2012）
  13. uniny 物体运动到一个点停止_unity控制运动
  14. 如何安装和使用vicuna
  15. Python自动化小技巧11——excel文件的文字内容筛选
  16. WAMP and WordPress Install on AWS Free Tier Windows 2012 R2
  17. Matlab从日文转换成英文或中文转换成英文
  18. 集美大学计算机课程考试系统,计算机系统结构-集美大学考试内容.docx
  19. linux一台主机部署多版本mysql_Linux---一台主机部署多版本mysql服务和mysql实例
  20. 当代世界经济发展趋势

热门文章

  1. Android（java）学习笔记158：多线程断点下载的原理（JavaSE实现）
  2. Ajax原理以及优缺点
  3. jQuery--.css(width)和.width()的区别
  4. 老友会 | 情怀与时光不期而遇的深情大趴（现场快讯）
  5. 淘宝双十一用哪些“潜规则”冲击1500亿？
  6. 咖友推荐|我是窝窝酱，我来了，你在哪儿？
  7. 产品经理不得不知的APP数据分析及报表设计基础
  8. PMCAFF | 为什么我们必须关注95后市场？
  9. 【专访】PP租车创业故事二：为什么要创业？
  10. RXThink 官方网站正式上线