<head>
<meta charset="UTF-8">
<title>左右选中</title>
<style>
input[type='button'] {
width: 50px;
}
</style>
<script>
//获取左右两个select 框的对象
//向右边的第一个按钮的功能
function toRight2() {
var selectLeftObj = document.getElementById("left");
var selectRightObj = document.getElementById("right");
var arr = selectLeftObj.options;
//遍历数组
/*for(var i = 0; i < arr.length; i++) {
if(arr[i].selected) {
selectRightObj.appendChild(arr[i]);
i--;
}
}*/
//此时打开页面会卡死 上面的不会
for(var i = 0; i < arr.length; ) {
if(arr[i].selected) {
selectRightObj.appendChild(arr[i]);
}
}
}
//向右边第三个按钮的功能
function toRight3() {
var selectLeftObj = document.getElementById("left");
var selectRightObj = document.getElementById("right");
var arr = selectLeftObj.options;
for(var i = 0; i < arr.length;) {
selectRightObj.appendChild(arr[i]);
}
}
</script>
</head>
<body>
<table>
<tr>
<td>
<select id="left" multiple="ture" style="width:100px" size="10">
<option>環</option>
<option>芈</option>
<option>琅</option>
<option>琊</option>
<option>爨</option>
<option>甄</option>
<option>槑</option>
<option>夔</option>
</select>
</td>
<td>
<input type="button" value=">" id="toRight1" onclick="toRight1()"><br>
<input type="button" value=">>" id="toRight2" onclick="toRight2()"><br>
<input type="button" value=">>>" id="toRight3" onclick="toRight3()"><br><br>
<input type="button" value="<" id="toLeft1" onclick="toLeft1()"><br>
<input type="button" value="<<" id="toLeft2" onclick="toLeft2()"><br>
<input type="button" value="<<<" id="toLeft3" onclick="toLeft3()">
</td>
<td>
<select id="right" multiple="true" style="width:100px" size="10">
</select>
</td>
</tr>
</table>
</body>
方便浏览代码 我把html标签去掉了 ,想请问大神的是 上方 function toRight2()
中代码执行的问题 加注释的部分可以顺利执行,但是根据function toRight3()中的代码 类比到2时 发现页面会卡死,想不通是为什么。求大神给解释一下啊。。