드 롭 다운 목록 이동 옵션 을 선택 하 십시오.

3539 단어 JavaScripthtmlXHTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>select.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
</head>

<body>
<select id="firstselect" size="10" multiple="multiple">
<option>  1</option>
<option>  2</option>
<option>  3</option>
<option>  4</option>
<option>  5</option>
<option>  6</option>
<option>  7</option>
<option>  8</option>
</select>

<button id="add" name="add">add</button>
<button id="addall" name="addall">addall</button>

<select id="secondselect" size="10" multiple="multiple">
<option>  9</option>
</select>

<script type="text/javascript">

//         
document.getElementById("add").onclick = function() {
//     select  
var firstselect = document.getElementById("firstselect");
//     select  
var secondselect = document.getElementById("secondselect");

//  firstselect  option  ,      
var optionElements = firstselect.getElementsByTagName("option");
var len = optionElements.length;

//     option  

//1. select  .selectedIndex              
//       alert(firstselect.selectedIndex);
//2.  ,           ,         ,  8 
for ( var i = 0; i < len; i++) {
if (firstselect.selectedIndex != -1) {
secondselect
.appendChild(optionElements[firstselect.selectedIndex]);
}
}

}
//addall     
/*
document.getElementById("addall").onclick = function() {
//     select  
var firstselect = document.getElementById("firstselect");
//     select  
var secondselect = document.getElementById("secondselect");
//  firstselect  option  ,      
var optionElements = firstselect.getElementsByTagName("option");
var len = optionElements.length;

while ( len!=0) {

var optionElement=optionElements[0];
secondselect.appendChild(optionElement);

}
}
*/
//addalla     
document.getElementById("addall").onclick = function() {
//     select  
var firstselect = document.getElementById("firstselect");
//     select  
var secondselect = document.getElementById("secondselect");

var len =firstselect.length;
for(var i=0;i<len;i++){
secondselect.appendChild(firstselect[0]);
}
}
//    
document.getElementById("firstselect").ondblclick = function() {
alert("runned");
//     select  
var firstselect = document.getElementById("firstselect");
//     select  
var secondselect = document.getElementById("secondselect");
var optionElements=document.getElementsByTagName("option");

var len =optionElements.length;
for(var i=0;i<len;i++){
secondselect.appendChild(optionElements[firstselect.selectedIndex]);
}
}

</script>
</body>
</html>
 

좋은 웹페이지 즐겨찾기