在以前的下拉列表中选择一个选项后删除它

Question

我需要删除在上一个 dropdwon 上选择的下拉列表中的选定选项。 例如，第一个、第二个和第三个下拉列表包含 A、B、C、D。一旦我在下拉列表 1 中选择了 A，它就不会出现在下拉列表 2 和 3 中。同样的事情会发生在下拉列表 2 和 3 中。强>

但在我的代码中，事情实际上是这样的：

我在 PHP 中通过循环填充了几个下拉列表。

for($y=1; $y<=5; $y++){
echo "<select id='seatplan$x' name='selectSeatplan[]' onChange='callSave($x,$sid)'>";

     echo "<select name='selectSeatplan[]'>";
     echo "<option value=''> ------------ </option>";
          seatplanDdNames($sid);
     echo "</select>";

} //END FOR Y<-5

请注意 * seatplanDdNames($sid) - 是一个从数据库中生成名称的函数，这就是我如何从中呼应选项：

function seatplanDdNames($sid) {
     echo "<option value='$studentno' onClick='callSave($x,$sid)'>$name</option>";
}

然后调用javascript函数保存：

function callSave(x,sid){

    var name = 'seatplan' + x;
    name = name.toString();
    var selectBox = document.getElementById(name);
    var strUser = selectBox.options[selectBox.selectedIndex].value;
    var js = document.createElement('script');
        js.setAttribute('language', 'javascript');
        js.setAttribute('type', 'text/javascript');
        js.setAttribute('src', 'seatplan-getvalues.php?uid='+strUser+'&sid='+sid+'&rtype=CLS&seatno='+x);
    document.body.appendChild(js);

    return false;
    } 

• 函数 callSave 将选定的选项保存在临时表中。只是我喜欢它的方式。问题是，我必须避免下拉菜单中提供的数据冗余。

有什么帮助吗？谢谢！

Answer 1

Lolo 的代码运行良好，但我需要更改 o.disabled = true 中的 style.dispaly = 'none' 以避免 OSX 和 iOS 中的 Chrome/Safari 出现问题（元素未隐藏）

if (p == undefined || p == s) {
  o.disabled = false;
}
// option otherwise
else {
  o.disabled = true;
}

行为不同，但结果相同。

Answer 2

Here 是纯 HTML/JS 示例。基本上在页面加载时，每个选择都有相同的选项。当您选择某些内容时，在其他选择时此选项会隐藏。