zoukankan      html  css  js  c++  java
  • js控制select多选

    <select multiple="multiple">
    	<option value="">AAAA</option>
    	<option value="">BBBB</option>
    	<option value="">CCCC</option>
    	<option value="">DDDD</option>
    </select>
    <input type="button" value="选中添加到右侧" onclick="toRight()">
    <input type="button" value="全部添加到右侧" onclick="toRightAll()">
    </div>
    
    
    <div>
    <select multiple="multiple">
    	<option value="">EEE</option>
    	<option value="">FFF</option>
    	<option value="">GGG</option>
    	<option value="">HHH</option>
    </select>
    <input type="button" value="选中添加到左侧" onclick="toLeft()">
    <input type="button" value="全部添加到左侧" onclick="toLeftAll()">
    </div>


    function toLeft() {
    		var left=document.getElementsByTagName("select")[0];
    		var right=document.getElementsByTagName("select")[1];
    
    		var sel=right.getElementsByTagName("option");
    		for (var i = 0; i < sel.length; i++) {
    			if (sel[i].selected==true) {
    				left.appendChild(sel[i]);
    				i--;
    			}
    		}
    	}
    
    	function toRight() {
    		var left=document.getElementsByTagName("select")[0];
    		var right=document.getElementsByTagName("select")[1];
    
    		var sel=left.getElementsByTagName("option");
    		for (var i = 0; i < sel.length; i++) {
    			if (sel[i].selected==true) {
    				right.appendChild(sel[i]);
    				i--;//!!!!!
    			}
    		}
    	}
    
    	function toLeftAll () {
    
    		var left=document.getElementsByTagName("select")[0];
    		var right=document.getElementsByTagName("select")[1];
    		var sel=right.getElementsByTagName("option");
    		for (var i = 0; i < sel.length; i++) {
    			
    				left.appendChild(sel[i]);
    				i--;//!!!!
    			
    		}
    	}
    	function toRightAll () {
    		var left=document.getElementsByTagName("select")[0];
    		var right=document.getElementsByTagName("select")[1];
    		var sel=left.getElementsByTagName("option");
    		for (var i = 0; i < sel.length; i++) {
    			
    				right.appendChild(sel[i]);
    				i--;
    			
    		}
    		
    	}


  • 相关阅读:
    鼠标移入和鼠标移出的提示,和样式的转换
    HTML5——新特性,拖放
    关于订阅发布模式
    titanium环境配置
    Matlab与C混编的介绍
    一个相对健壮的node 静态http服务器
    阻赛非阻塞同步异步
    最近在做的事以及一些安排
    说一说js中__proto__和prototype以及原型继承的那些事
    PHP写的爬虫,爬指定网站页面上的各种图片
  • 原文地址:https://www.cnblogs.com/fighterhit/p/6387926.html
Copyright © 2011-2022 走看看