Question

我的代码正在使用Chrome，但不适用于Edge。

当我选择一个选项时，该选项应该会在其他选择元素中消失，但它不会消失/隐藏。

代码：

function toggleHide(selectElement) {
  //Getting all select elements
  var arraySelects = document.getElementsByClassName('dropdowns');
  //Getting selected index
  var selectedOption = selectElement.selectedIndex;
  //Disabling options at same index in other select elements
  for (var i = 0; i < arraySelects.length; i++) {
    if (arraySelects[i] == selectElement)
      continue; //Passing the selected Select Element

    arraySelects[i].options[selectedOption].hidden = true;
  }
}

<body>
  <form>
    <select onchange="toggleHide(this);" class="dropdowns" id="dropdowns1">
      <option value="" disabled selected hidden>Please Choose a status...</option>
      <option>Apple</option>
      <option>Banana</option>
      <option>Orange</option>
      <option>Strawberry</option>
    </select>
    <select onchange="toggleHide(this);" class="dropdowns" id="dropdowns2">
      <option value="" disabled selected hidden>Please Choose a status...</option>
      <option>Apple</option>
      <option>Banana</option>
      <option>orange</option>
      <option>Strawberry</option>
    </select>
    <select onchange="toggleHide(this);" class="dropdowns" id="dropdowns3">
      <option value="" disabled selected hidden>Please Choose a status...</option>
      <option>Apple</option>
      <option>Banana</option>
      <option>orange</option>
      <option>Strawberry</option>
    </select>
    <select onchange="toggleHide(this);" class="dropdowns" id="dropdowns4">
      <option value="" disabled selected hidden>Please Choose a status...</option>
      <option>Apple</option>
      <option>Banana</option>
      <option>orange</option>
      <option>Strawberry</option>
    </select>
  </form>
</body>

Edge没有运行我的JavaScript

0 个答案: