国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 語言 > JavaScript > 正文

下拉列表select 由左邊框移動到右邊示例

2024-05-06 15:56:52
字體:
來源:轉載
供稿:網友
select由左邊框移動到右邊,下面有個不錯的示例,大家可以參考下

當頁面還沒有加載完的時候調用下面語句,會取不到“add” 這個對象,提示為空或不是對象

復制代碼 代碼如下:


document.getElementById("add").onclick = function(){
alert("hello");
}


當使用便可取的對象

復制代碼 代碼如下:


window.onload = function(){
document.getElementById("add").onclick = function(){
alert("hello");
}
}


復制代碼 代碼如下:


<script type="text/javascript">
//選中的從左邊移到右邊
function toright() {
var firstElement = document.getElementById("first");
var secondElement = document.getElementById("second");
var firstoptionElement = firstElement.getElementsByTagName("option");
var len = firstoptionElement.length;
for(var i=0;i<len;i++){
if(firstElement.selectedIndex != -1){ //selectedIndex 是select 的屬性
secondElement.appendChild(firstoptionElement[firstElement.selectedIndex]);
}
}
}
//全部移動到右邊
function allright(){
var firstElement = document.getElementById("first");
var secondElement = document.getElementById("second");
var firstoptionElement = firstElement.getElementsByTagName("option");
var len = firstoptionElement.length;
for(var i=0;i<len;i++){
secondElement.appendChild(firstoptionElement[0]);//option選項選中時候索引為0
}
}
//雙擊移動到右邊
function db(){
/* //方法一
var firstElement = document.getElementById("first");
var secondElement = document.getElementById("second");
var firstoptionElement = firstElement.getElementsByTagName("option");
var len = firstoptionElement.length;
for(var i=0;i<len;i++){
if(firstElement.selectedIndex != -1){ //selectedIndex 是select 的屬性
secondElement.appendChild(firstoptionElement[firstElement.selectedIndex]);
}
} */
//方法二
var firstElement = document.getElementById("first");
var secondElement = document.getElementById("second");
secondElement.appendChild(firstElement[firstElement.selectedIndex]);
}

</script>

<style type="text/css">

</style>
</head>
<body>
<table>
<tr>
<td>
<select size="10" multiple="multiple" ondblclick="db()">
<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 valign="middle">
<input type="button" value="---->"/>
<input type="button" value="==>"/>
</td>
<td>
<select size="10" multiple="multiple">
<option value="選項8">選項8</option>
</select>
</td>
</tr>
</table>
</body>

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表

圖片精選

主站蜘蛛池模板: 土默特右旗| 洪洞县| 扬州市| 安平县| 九龙城区| 龙山县| 门源| 格尔木市| 嘉荫县| 武鸣县| 新龙县| 柏乡县| 葫芦岛市| 溧阳市| 常山县| 景德镇市| 涞源县| 文山县| 博湖县| 汝阳县| 黑龙江省| 赣榆县| 邓州市| 柘荣县| 永新县| 九龙坡区| 祁门县| 琼结县| 栾城县| 奉化市| 咸阳市| 东明县| 黑河市| 赫章县| 嫩江县| 芒康县| 广水市| 榆树市| 呼和浩特市| 乐都县| 比如县|