Pensado un poco más detenidamente el problema hice esta solución, aunque lo que propongo es borrar y reconstruir todos los select con cada cambio.
<select id="op0" onchange="redibuja(0,this.value)"></select>
<select id="op1" onchange="redibuja(1,this.value)"></select>
<select id="op2" onchange="redibuja(2,this.value)"></select>
<select id="op3" onchange="redibuja(3,this.value)"></select>
Código Javascript
:
Ver originalvar opciones=['verde','amarillo','rojo','azul','blanco'];//lista o menú de las opciones de los select
var seleccionados=['verde','amarillo','rojo','azul'];//lista que guardará qué se escogió en cada select, predefinimos la lista
function redibuja(indice,valor){//cuando un select cambie se le pasa ala función número de select y valor escogido
seleccionados[indice]=valor;//guardamos el valor escogido
for(var x=0;x<4;x++){//recorremos los 4 select
var select=document.getElementById('op'+x);//apuntamos a un select
select.length=0;//le borramos las opciones del select
for(var j=0;j<opciones.length;j++){//recorremos la lista o menú de opciones
var enselect=seleccionados.indexOf(opciones[j]);//para la opción actual, la buscamos en la lista de seleccionados
if(enselect==-1 || enselect==x){//si no se ha seleccionado la opción en ningún select o si se trata del select actual
select.length++;//creamos una opción nueva en el select (en blanco)
select.options[select.length-1].value=opciones[j];//le agregamos un valor a la opción
select.options[select.length-1].text=opciones[j];//le agregamos texto
if(select.options[select.length-1].value==seleccionados[x])//si la opción agregada es la opción seleccionada en el select (de la lista guardada)
select.options[select.length-1].selected=true;//preseleccionamos la opción
}
}
}
}
redibuja(0,'verde');//para dibujar la lista por primera vez
Espero te sirva.