多个select 的互斥选择实现

/*
* 目前不支持狐火 浏览器
*
*
*
*
*
*/


/******** 声明全局变量 *****/
var selectObjects=[];//空的数组，用于构建数组对象
var selectArray=new Object();//用于存储临时select的对象数组
/***
* 初始化页面时 调用onLoad()
*
*
*/

window.οnlοad=function(){
var newSelect=document.getElementById("000");
selectArray.selectName=newSelect.name;
//alert(selectArray.selectName+" "+newSelect.length);
selectArray.options=[];
for(var i=0;i<newSelect.length;i++){
selectArray.options[i]=newSelect.options[i];
//alert(selectArray.options[i].innerHTML);
}
}
/******** 生成新增加的select id 号 *****/
function getId(){

var now= new Date();

var time=now.getTime();

// filePath=floderPath+retime;
//alert(filePath);
return time;

}
/**** 新增一个select ***** */
function addSelect(){
var tbody=document.all.body;
var newSelect=document.createElement("select");
newSelect.id=getId();
newSelect.name=selectArray.selectName;
addSeletContext(newSelect);//赋值
// alert(newSelect.outerHTML+" "+select.outerHTML);
//动态增加onchange事件
if(window.addEventListener) {// Mozilla, Netscape, Firefox

newSelect.addEventListener('change', selectchange(newSelect.id),false);
newSelect.attachEvent('mouseover',function(){return selectmouseover.apply(this,[newSelect.id]);});
}
else// IE
{
newSelect.attachEvent('onchange',function(){return selectchange.apply(this,[newSelect.id]);});
newSelect.attachEvent('onmouseover',function(){return selectmouseover.apply(this,[newSelect.id]);});
}
// newSelect.addEventListener('change', selectchange(newSelect.id),false);

tbody.appendChild(newSelect);
//增加一个 对象
addObject(newSelect);
//alert(findpreferIndexByselectId(newSelect.id));

}

/****** 给新增的select 赋值 *******/
function addSeletContext(selectTo){
//得到目标select
var selectTem=selectTo;
var selectFrom=selectArray;
//alert(selectIdTo);
var tem=selectObjects[findpreferIndexByselectId(selectTo.id)];
//alert(tem);
var value="";

// 从源select 给目标select 赋值
for(var i=0;i<selectFrom.options.length;i++){
//alert(selectFrom.options[i].value);
oOption=selectFrom.options[i];
//alert(oOption.innerHTML+" "+oOption.value);
selectTem.options.add(new Option(oOption.innerHTML,oOption.value));
//selectTem.appendChild(oOption);
//alert(selectTem.options[i].value+" "+oOption.innerHTML);

}
//alert("selectTem.options.length is "+selectTem.options.length)
//初始化select 的value
if(tem!=undefined){
value=selectObjects[findpreferIndexByselectId(selectTo.id)].selectValue.toString();
var innerHTML=selectObjects[findpreferIndexByselectId(selectTo.id)].selectInnerHTML;
//alert(innerHTML);
//alert("value is "+value+" selectTem.options.length is "+selectTem.options.length);
var exist=false;
for(var i=0;i<selectTem.options.length;i++){
//alert("selectTem.options[i].value is "+selectTem.options[i].value+ "value is "+value+"== is ");
if(selectTem.options[i].value==value){
exist=true;
//selectTem.options[i].selected = true;
// alert("i is "+i+" "+selectTem.options[i].selected);
}
}
if(!exist){//新生成的下拉菜单没有value 项 则添加进去 再 设为默认值
selectTem.options.add(new Option(innerHTML,value));
selectTem.value=value;

}
}

}
/****** 新增一个对象 ***/
function addObject(newSelect){
// 增加一个 对象
selectObject=new Object();
selectObject.selectId=newSelect.id;
selectObject.selectName=newSelect.name;
selectObject.selectedIndex=newSelect.selectedIndex;
//alert(newSelect.selectedIndex);
selectObject.selectValue=newSelect.options[newSelect.selectedIndex].value;
selectObject.selectInnerHTML=newSelect.options[newSelect.selectedIndex].innerHTML;
// alert(selectObject.selectInnerHTML);
selectObject.preferValue="";
selectObject.preferInnerHTML="";
selectObjects.push(selectObject);
}
/********据selectId 查出preferIndex **********/
function findpreferIndexByselectId(id){
var i;
for(i=0;i<selectObjects.length;i++){
if(selectObjects[i].selectId==id){
return i;
}
}
//没有匹配的id 返回null
if(i>=selectObjects.length)
return null;
}
/*******select 的onchange 事件 ***/
function selectchange(id){
//alert(id);
var select=document.getElementById(id);
var selectedIndex=select.selectedIndex;
//alert(selectedIndex);

//var temString=selectArray.options.join();
//alert(temString);

//用Object 保存select的value
selectObjects[findpreferIndexByselectId(id)].selectValue=select.options[selectedIndex].value;
selectObjects[findpreferIndexByselectId(id)].selectInnerHTML=select.options[selectedIndex].innerHTML;
//alert("findpreferIndexByselectId(id) is "+findpreferIndexByselectId(id)+"select.options[selectedIndex].value is "+selectObjects[findpreferIndexByselectId(id)].selectValue);
//alert("length is "+selectArray.options.length);
//删除 临时数组的options
var index=selectArray.options.indexOf(select.options[selectedIndex]);
if(index!=-1)
selectArray.options.splice(index,1);
//alert("new length is "+selectArray.options.length)
//selectObjects[findpreferIndexByselectId(id).split(',')].
//把获得焦点的select添置于selectArray
var option=new Object();
option.value=selectObjects[findpreferIndexByselectId(id)].preferValue;
option.innerHTML=selectObjects[findpreferIndexByselectId(id)].preferInnerHTML;
//alert(option.value);
selectArrayAdd(option);
//其他的select重新赋值
selectAllassignment(id);
}
Array.prototype.indexOf = function(str){
for(var i=0;i<this.length;i++){
if(str.value==this[i].value){
return i;
}
}
return -1;
}
/************ select 的 onmouseover 事件 ************/
function selectmouseover(id){
//Object存储 select 的preferValue
var select=document.getElementById(id);
var idtem=findpreferIndexByselectId(id);
//alert(select.selectedIndex);
selectObjects[idtem].preferValue=select.options[select.selectedIndex].value;
selectObjects[idtem].preferInnerHTML=select.options[select.selectedIndex].innerHTML;
//alert("idtem is "+idtem+"selectValue is "+selectObjects[idtem].preferValue);
//把获得焦点的select添置于selectArray
//selectArrayAdd(select.options[select.selectedIndex]);

}
/******让动态生成的select 重新赋值 * */
function selectAllassignment(id){
for(var i=0;i<selectObjects.length;i++){
var idtem=selectObjects[i].selectId;
//alert(idtem+"id is "+id);
if(idtem!=id){
var select=document.getElementById(idtem);
//清除已有的option
//alert(select.options.length);
while(select.options.length>0){
select.remove(0);
//alert("j is "+j);
}
// 重新赋值
addSeletContext(select);

//alert("findpreferIndexByselectId(id) is "+findpreferIndexByselectId(idtem)+" value is "+selectObjects[findpreferIndexByselectId(idtem)].selectValue);
}
else{//select.id 号 为id 的select 不用重新赋值
//alert("选中的select 的id is "+id);
}

}
}
/** 向selectArray添加数据， selectArray已经存在该数据不添加， 无则添致尾部
*
*/

function selectArrayAdd(option){
var exist=false;
for(var i=0;i<selectArray.options.length;i++){
if(selectArray.options[i].value==option.value){
exist=true;
}
}
if(!exist){
selectArray.options.push(option);
}
}