在另一个下拉列表中选择时从下拉列表中删除项目 [英] Removing an Item from a dropdown when selected in another dropdown

问题描述

此页面将有16个下拉框，当我从每个选项中选择一个项目时，我希望将其从所有其他人中删除。

This page will have 16 dropdown boxes, when I select an item from each of them, I'd like it to be removed from all the others.

是一个足球阵容页面，如果这有助于您绘制场景。

This is for a football lineup page, if that helps you picture the scenario.

我希望这不是太模糊，我很清楚我在挣扎。

I hope this isn't too vague and I'm clear in what I'm struggling with.

感谢：）

我在整个项目中使用：HTML，PHP，Javascript，AJAX

I am using in the whole project: HTML, PHP, Javascript, AJAX

<select name="pl1">
  <option value="1">Ben</option>
  <option value="2">Jack</option>
  <option value="3">James</option>
  <option value="4">John</option>
</select>

<select name="pl2">
  <option value="1">Ben</option>
  <option value="2">Jack</option>
  <option value="3">James</option>
  <option value="4">John</option>
</select>

<select name="pl3">
  <option value="1">Ben</option>
  <option value="2">Jack</option>
  <option value="3">James</option>
  <option value="4">John</option>
</select>

<select name="pl4">
  <option value="1">Ben</option>
  <option value="2">Jack</option>
  <option value="3">James</option>
  <option value="4">John</option>
</select>

推荐答案

Javascript解决方案：

Javascript solution:

function check() {
  d=document;
  myArray = [];
  for (h=0;h<4;h++) {
    myArray[h] = d.getElementById('pl'+(h+1)).value;
  }
  for (a=0;a<4;a++) {
    for (b=1;b<5;b++) {
    d.getElementById('pl'+(a+1)).options[b].style.display = "block";
      for (c=0;c<4;c++) {
        if(d.getElementById('pl'+(a+1)).options[b].value == myArray[c]) {
          d.getElementById('pl'+(a+1)).options[b].style.display = "none";
        }
      }
    }
  }
}

HTML：

<select id="pl1" onchange="check();">
  <option value="">Choose</option>
  <option value="1">Ben</option>
  <option value="2">Jack</option>
  <option value="3">James</option>
  <option value="4">John</option>
</select>

<select id="pl2" onchange="check();">
  <option value="">Choose</option>
  <option value="1">Ben</option>
  <option value="2">Jack</option>
  <option value="3">James</option>
  <option value="4">John</option>
</select>

<select id="pl3" onchange="check();">
  <option value="">Choose</option>
  <option value="1">Ben</option>
  <option value="2">Jack</option>
  <option value="3">James</option>
  <option value="4">John</option>
</select>

<select id="pl4" onchange="check();">
  <option value="">Choose</option>
  <option value="1">Ben</option>
  <option value="2">Jack</option>
  <option value="3">James</option>
  <option value="4">John</option>
</select>

确保您在选择的

这篇关于在另一个下拉列表中选择时从下拉列表中删除项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！