JS多项目选择脚本

最新推荐文章于 2019-01-02 12:13:53 发布

iteye_17076

最新推荐文章于 2019-01-02 12:13:53 发布

阅读量81

点赞数

分类专栏： JavaScript 文章标签：脚本

JavaScript 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

[code]
<html>
<script language="javascript">
function insertall(){
var oDest=document.all.lstSelected;
for (var i=0;i<document.all.personList.options.length;i++)
{
var e=document.all.personList.options[i];
insert(oDest,e.innerText,e.value);
}
oDest=document.all.personList;
removeAll(oDest);
}

function removeAll(oSelect){
for( i=oSelect.childNodes.length -1;i>=0;i--){
var node = oSelect.childNodes(i);
oSelect.removeChild(node);
}
}

function insert2(){
var oDest=document.all.lstSelected;
for (var i=0;i<document.all.personList.options.length;i++)
{
var e=document.all.personList.options[i];
if (e.selected){
insert(oDest,e.innerText,e.value);
}
}
oDest=document.all.personList;
removeSelected(oDest);
}

function yichu2(){
var oDest=document.all.personList;
for (var i=0;i<document.all.lstSelected.options.length;i++)
{
var e=document.all.lstSelected.options[i];
if (e.selected){
insert(oDest,e.innerText,e.value);
}
}
oDest=document.all.lstSelected;
removeSelected(oDest);
}

function quanyi2(){
var oDest=document.all.personList;
for (var i=0;i<document.all.lstSelected.options.length;i++)
{
var e=document.all.lstSelected.options[i];
insert(oDest,e.innerText,e.value);

}
oDest=document.all.lstSelected;
removeAll(oDest);
}

function insert(oDest,name, value){
var oNewNode = document.createElement("option");
oNewNode.innerText=name;
oNewNode.value = value;
addUniqueNode(oNewNode, oDest)
}

function addUniqueNode(node, oDest){
var oNewNode = document.createElement("option");
var nodeExist = false;
for(y in oDest.children){
if(node.value == oDest.children[y].value){
nodeExist = true;
break;
}
}

if(!nodeExist){
var newNode = node.cloneNode(true);
oDest.appendChild(newNode);
}
}

function removeSelected(oSelect){
for( i=oSelect.childNodes.length -1;i>=0;i--){
var node = oSelect.childNodes(i);
if(node.selected){
oSelect.removeChild(node);
}
}
}
</script>
<body>
<table border="0">
<tr>
<td>
<select name="personList" size="4" MULTIPLE style="width: 200px;height:100px">
<option value="1">中国广州</option>
<option value="2">中国上海</option>
<option value="3">中国北京</option>
<option value="4">中国武汉</option>
</select>
</td>
<td width=50>
<input name="add" type="button" onClick="insert2();" value="添加">
<input name="yichu" type="button" onClick="yichu2();" value="移除">
<input name="quanyi" type="button" onClick="quanyi2();" value="全移" >
<input name="addall" type="button" onClick="insertall();" value="全加">
</td>
<td>
<select name="lstSelected" size="4" MULTIPLE style="width:200px;height:100px">
</select>
</td>
</tr>
</table>
</body>
</html>
[/code]
= =#还有待重构一下

iteye_17076

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS多项目选择脚本

[code] function insertall(){ var oDest=document.all.lstSelected; for (var i=0;i=0;i--){ var node = oSelect.childNodes(i); oSelect.removeChild(node); } } ...
复制链接

扫一扫