关于select option的问题
一个页面上有两个select,它们的option值相同,当第一个select选择某一option值时,如何让第二个select不再显示已被之前select选中的option值?
我表述的不清,举个例子说,一个主办人的下拉框,还有一个协办人的下拉框,它们都有两个选择项(option),一个值是“张三”,一个是“李四”。如果我第一个下拉框选择了“张三”,如何让第二个下拉框不再显示“张三”呢?
------解决方案--------------------使用js,当第一个下拉框选择发生改变时,通过js获得第一个下拉框选择的值,并遍历第二个下拉框将相同的值去掉。
------解决方案-------------------- <SELECT id= "pp " onchange= "deleOption() ">
<option value= "-1 "> ++++ </option>
<OPTION value= "1 "> haha </OPTION>
<OPTION value= "2 "> xixi </OPTION>
<OPTION value= "3 "> jack </OPTION>
<OPTION value= "4 "> lele </OPTION>
</SELECT>
<SELECT id= "qq ">
<option value= "-1 "> ++++ </option>
<OPTION value= "1 "> haha </OPTION>
<OPTION value= "2 "> xixi </OPTION>
<OPTION value= "3 "> jack </OPTION>
<OPTION value= "4 "> lele </OPTION>
</SELECT>
function deleOption()
{
var sele1 = document.getElementById( "pp ");
var sele2 = document.getElementById( "qq ");
alert(sele1.value);
for(var i =0;i <sele2.options.length;i++)
{
if(sele1.value==sele2.options[i].value)
{
sele2.removeChild(sele2.options[i]);
}
}
//document.getElementById( "qq ").remove(document.getElementById( "pp ").selectIndex);
}
------解决方案-------------------- function deleOption()
{
var sele1 = document.getElementById( "pp ");
var sele2 = document.getElementById( "qq ");
sele2.options.length=0;
for(var i=0;i <sele1.options.length;i++)
{
var opt = document.createElement( "option ");
opt.text = sele1.options[i].text;
opt.value = sele1.options[i].value;
sele2.add(opt);
}
if(sele1.value==-1)
{
return;
}
for(var i =0;i <sele2.options.length;i++)
{
if(sele1.value==sele2.options[i].value)
{
sele2.removeChild(sele2.options[i]);
}
}
//document.getElementById( "qq ").remove(document.getElementById( "pp ").selectIndex);
}
------解决方案--------------------简单的例子 看看吧
<BODY>
<select id= 's1 ' onchange= 'c(this.value) '>
<option value= ' '> </option>
<option value= '000 '> 000 </option>
<option value= '111 '> 111 </option>
<option value= '222 '> 222 </option>
<option value= '333 '> 333 </option>
</select>
<select id= 's2 ' >
<option value= ' '> </option>
<option value= '000 '> 000 </option>
<option value= '111 '> 111 </option>
<option value= '222 '> 222 </option>
<option value= '333 '> 333 </option>
</select>
<script>
var v0= ' ';
function c(v){
var item=document.getElementById( "