<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>列表操作</title>
<script type="text/javascript">
var $=function(strId){
return document.getElementById(strId);
}
//定义操作select类对象
function SelectOperater(oSrcEl,oDstEl,oPushTrigger,oPopTrigger,nSrcSize,nDstSize){
//获取操作对象
this.srcEl=typeof(oSrcEl)=="object"?oSrcEl:$(oSrcEl);
this.dstEl=typeof(oDstEl)=="object"?oDstEl:$(oDstEl);
this.pushTrigger=typeof(oPushTrigger)=="object"?oDstEl:$(oPushTrigger);
this.popTrigger=typeof(oPopTrigger)=="object"?oDstEl:$(oPopTrigger);
//设置类型为下拉列表
this.srcEl.size=parseInt(nSrcSize);
this.dstEl.size=parseInt(nDstSize);
this.srcEl.multiple=true;
this.dstEl.multiple=true;
//进行事件绑定
var oSelOperator=this;
this.srcEl.ondblclick=function(){
var srcEl=oSelOperator.srcEl;
var dstEl=oSelOperator.dstEl;
if(srcEl.selectedIndex>-1){
var oOption=srcEl.options[srcEl.selectedIndex];
dstEl.options.add(new Option(oOption.text,oOption.value));
if(document.all)
srcEl.options.remove(oOption.index);
else
srcEl.removeChild(oOption);
}
}
this.dstEl.ondblclick=function(){
var srcEl=oSelOperator.srcEl;
var dstEl=oSelOperator.dstEl;
if(dstEl.selectedIndex>-1){
var oOption=dstEl.options[dstEl.selectedIndex];
srcEl.options.add(new Option(oOption.text,oOption.value));
if(document.all)
dstEl.options.remove(oOption.index);
else
dstEl.removeChild(oOption);
}
}
this.pushTrigger.onclick=function(){
var srcEl=oSelOperator.srcEl;
var dstEl=oSelOperator.dstEl;
var oOption,arrSelect=new Array();
//获取选中项添加
for(var i=0,nLen=srcEl.options.length;i<nLen;i++){
if(srcEl.options[i].selected){
oOption=srcEl.options[i];
dstEl.options.add(new Option(oOption.text,oOption.value));
arrSelect.push(i-arrSelect.length);
}
}
//对选中项进行移除操作
for(var i=0,nLen=arrSelect.length;i<nLen;i++){
if(document.all)
srcEl.options.remove(srcEl.options[arrSelect[i]].index);
else
srcEl.removeChild(srcEl.options[arrSelect[i]]);
}
}
this.popTrigger.onclick=function(){
var srcEl=oSelOperator.srcEl;
var dstEl=oSelOperator.dstEl;
var oOption,arrSelect=new Array();
//获取选中项添加
for(var i=0,nLen=dstEl.options.length;i<nLen;i++){
if(dstEl.options[i].selected){
oOption=dstEl.options[i];
srcEl.options.add(new Option(oOption.text,oOption.value));
arrSelect.push(i-arrSelect.length);
}
}
//对选中项进行移除操作
for(var i=0,nLen=arrSelect.length;i<nLen;i++){
if(document.all)
dstEl.options.remove(dstEl.options[arrSelect[i]].index);
else
dstEl.removeChild(dstEl.options[arrSelect[i]]);
}
}
}
window.onload=function(){
new SelectOperater("select1","select2","btnAdd","btnDel",15,15);
}
</script>
</head>
<body>
<label>
<select name="select1" id="select1" style="width:200px">
<option value="1458" selected="selected">三星</option>
<option value="1452">摩托罗拉</option>
<option value="1448">诺基亚</option>
<option value="1461">CECT</option>
<option value="1446">中兴</option>
<option value="1444">波导</option>
<option value="1428">索尼</option>
<option value="1442">TCL</option>
<option value="1456">夏新</option>
<option value="1438">海尔</option>
<option value="1459">LG</option>
<option value="1437">康佳</option>
<option value="1471">联想</option>
<option value="1506">天时达</option>
<option value="1460">NEC</option>
<option value="1498">ZTC中天</option>
<option value="1449">南方高科</option>
<option value="1450">西门子</option>
<option value="1453">阿尔卡特</option>
<option value="1465">托普</option>
<option value="1493">OKWAP</option>
<option value="1468">UT斯达康</option>
<option value="1469">大显</option>
<option value="1466">迪比特</option>
<option value="1479">金立</option>
<option value="1451">飞利浦</option>
<option value="1445">首信</option>
<option value="1440">东信</option>
<option value="1439">科健</option>
<option value="1477">桑达</option>
<option value="1462">海信</option>
<option value="1508">奥克斯</option>
<option value="1443">熊猫</option>
<option value="1478">唯开</option>
<option value="1495">侨兴</option>
<option value="1482">明基</option>
<option value="1537">GT佳通</option>
<option value="1544">天语</option>
<option value="1509">华为</option>
<option value="1454">松下</option>
<option value="1473">多普达</option>
<option value="1475">万利达</option>
<option value="1457">爱立信</option>
<option value="1481">普天</option>
<option value="1512">泛泰</option>
<option value="1511">金鹏</option>
<option value="1570">德赛</option>
<option value="1429">三菱</option>
<option value="1529">创维</option>
<option value="1500">杰特Ztel</option>
<option value="1501">至高</option>
<option value="1519">SK</option>
<option value="1525">维科</option>
<option value="1476">乐华</option>
<option value="1533">夏普</option>
<option value="1540">振华欧比</option>
<option value="1503">步步高</option>
<option value="1531">科盛通信</option>
<option value="1523">互通</option>
<option value="1557">友利通</option>
<option value=