查询HTML标签select中options的值并定位其位置

查询HTML标签select中options的值并定位其位置！

JavaScript实现！

示例：

<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN"> <HTML> <HEAD> 　<TITLE>NewDocument</TITLE> 　<META NAME="Author" CONTENT="majianan"> <SCRIPT> 　　varcurrentSel=null; 　　function setButton(obj){　　　　 　　　　if(obj.length==0)return; 　　　　currentSel=obj; 　　　　if(obj.id=="leftSel"){ 　　　　　　document.getElementById("btnLeft").disabled=true; 　　　　　　document.getElementById("btnRight").disabled=false;　　　　　　　　 　　　　　　reSelect(document.getElementById("rightSel"));　　　　　　 　　　　}else{ 　　　　　　document.getElementById("btnLeft").disabled=false; 　　　　　　document.getElementById("btnRight").disabled=true;　　　　　　　 　　　　　　reSelect(document.getElementById("leftSel"));　　　　　　　　 　　　　}　　　 　　} 　　　function move(){ 　　　　　if(arguments.length==1){ 　　　　　　　moveUp(arguments[0]); 　　　　　}else if(arguments.length==2){ 　　　　　　　moveRight(arguments[0],arguments[1]); 　　　　　} 　　　} 　　　function moveUp(direction){ 　　　　　if(currentSel==null)return; 　　　　　if(direction){//up 　　　　　　if(currentSel.selectedIndex>0){　 　　　　　　　　for(vari=0;i<currentSel.length;i++){ 　　　　　　　　　　if(currentSel[i].selected){ 　　　　　　　　　　　　var oOption=currentSel.options[i]; 　　　　　　　　　　　　var oPrevOption=currentSel.options[i---1]; 　　　　　　　　　　　　currentSel.insertBefore(oOption,oPrevOption); 　　　　　　　　　　} 　　　　　　　　}　　　　　　　　 　　　　　　} 　　　　　}else{//down 　　　　　　for(var i=currentSel.length-1;i>=0;i--){ 　　　　　　　　if(currentSel[i].selected){ 　　　　　　　　　　if(i==currentSel.length-1)return; 　　　　　　　　　　var oOption=currentSel.options[i]; 　　　　　　　　　　var oNextOption=currentSel.options[i+1]; 　　　　　　　　　　currentSel.insertBefore(oNextOption,oOption);　　　　　　　　　　　　 　　　　　　　　} 　　　　　　} 　　　　　} 　　　} 　　function moveRight(src,des){ 　　　　if(src.selectedIndex==-1){ 　　　　　　alert("Please select first!"); 　　　　　　return; 　　　　} 　　　　for(var i=0;i<src.length;i++){ 　　　　　　if(src[i].selected){ 　　　　　　　　des.appendChild(src.options[i--]); 　　　　　　} 　　　　} 　　　　setButton(des); 　　} 　　 　　function reSelect(obj){ 　　　　for(var i=0;i<obj.length;i++){ 　　　　　　if(obj[i].selected)obj[i].selected=false; 　　　　} 　　} 

function chaxun()    {var e=document.getElementById("rightSel");var txt=document.getElementById("CHAXUN").value;for(var i =0;i<e.options.length;i++)        {if(e.options[i].value == txt))            {                e.options[i].selected=true;            }else                e.options[i].selected=false;        }    }　　</SCRIPT> </HEAD> <BODY> 　<tr> 　<td>   <input type="text" id="CHAXUN" size="53" maxlength="1000"  value=""></td><td>  <input type="submit" id="Submit" value="查询"  onclick="chaxun();" title="查询"></td></tr>　<form id="form1"> 　　　<table width="40%"align="center"> 　　　　　<tr> 　　　　　　　<td> 　　　　　　　　　<input type="button" value="Up" id="btnUp" onClick="move(true);"style="width:65"/> 　　　　　　　　<br/> 　　　　　　　　<input type="button" value="Down" id="btnDowm" onClick="move(false);"style="width:65"/>　　　　　　　　 　　　　　　　</td> 　　　　　　　<td> 　　　　　　　　　<select multiple id="leftSel" onclick="setButton(this)" ondblclick="document.getElementById('btnRight').click()" style="height:200px;width:100px;"> 　　　　　　　　　　<option value="Java">Java</option> 　　　　　　　　　　<option value="JavaScript">JavaScript</option> 　　　　　　　　　　<option value="C++">C++</option> 　　　　　　　　　　<option value="HTML">HTML</option> 　　　　　　　　</select> 　　　　　　</td> 　　　　　　<td> 　　　　　　　　<input type="button" value=">>" id="btnRight" onClick="move(document.getElementById('leftSel'),document.getElementById('rightSel'));" style="width:65"/> 　　　　　　　　<br/> 　　　　　　　　<input type="button" value="<<" id="btnLeft" onClick="move(document.getElementById('rightSel'),document.getElementById('leftSel'));" style="width:65"/> 　　　　　　　　</td> 　　　　　　　　<td> 　　　　　　　　　　<select multiple id="rightSel" onclick="setButton(this)"　ondblclick="document.getElementById('btnLeft').click()" style="height:200px;width:100px;"> 　　　　　　　　　　<option value="CSS">CSS</option> 　　　　　　　　　　<option value=".Net">.Net</option> 　　　　　　　　　　</select> 　　　　　　　　</td> 　　　　　　</tr> 　　　　</table> 　　</form> </BODY> </HTML>

转载于:https://www.cnblogs.com/kingangWang/archive/2011/12/30/2307595.html

查询HTML标签select中options的值并定位其位置相关推荐

随手记一次用C#正则表达式获取下拉菜单html标签select以及相关属性值
随手记一次用C#正则表达式获取下拉菜单html标签<select>以及相关属性值 1:有如下html: .................. <select id="aaa ...
怎么用js动态设置select中的某个值为选中项
可以使用javascript和jQuery两种实现方式 1:使用javascript实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr ...
查询一列不同值的数据 mysql_怎样查询两个表中同一字段的不同数据值
怎样查询两个表中同一字段的不同数据值例如: A表中的字段a有40000条数据 B表中的字段a有60000条数据,其中的40000条数据跟A表是一样的怎样能把那不一样的20000条数据查询出来啊? ...
antd vue 多个下拉联动_antd中select下拉框值为对象选中的问题
使用antd中的select下拉框,遇到个小问题,后台管理系统中,使用下拉框,一般不会是简单的就直接使用select中的value值,而是会使用id或者value中文对应的keyword,并且这个在o ...
php查询mysql数据库_php中如何查询mysql数据库数据？
php中查询mysql数据库数据的方法:首先用navicat新建数据库并建表:然后添加数据并与数据库连接:接着用[mysql_select_db]函数选择要查询的数据库:最后将文件在浏览器中打开即可. ...
select html默认选中的值,HTML/jquery中的select标签设置默认选中取值
一.jQuery中的select标签设置默认选中取值每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如 1.设置value为pxx的项选中 $(" ...
html5下拉列表默认值,element-ui中的select下拉列表设置默认值方法_简单_前端开发者...
element-ui中的select下拉列表如何设置默认值? 在element-ui的运用中,涉及到了select下拉列表.项目中需要将select的默认值给展示出来那如何修改呢? 上element ...
oracle sqlcode 多条,SQL查询以连接Oracle中多个行的列值
是否有可能构造SQL来连接列值多行? 以下是一个示例: 表A PID A B C 表B PID SEQ DESC A 1 Have A 2 a nice ...
js获取用户在input标签中输入的值，然后改变html下各个标签的值或者属性
2019独角兽企业重金招聘Python工程师标准>>> <!DOCTYPE html> <html lang="en"> <head ...

查询HTML标签select中options的值并定位其位置

查询HTML标签select中options的值并定位其位置相关推荐

最新文章

热门文章