Javascript 在多个选择下拉列表中，所选下拉列表值（选项）需要隐藏在其余下拉列表中

我正在创建一个web表单，其中包含3个带有多个问题的选择框。如果我从1st select下拉列表中选择第一个问题，则该问题将不会出现在2nd select下拉列表中。它将重复与第三选择下拉列表相同的操作

注意：主要目的是，如果用户从选择下拉列表中选择任何问题，该问题将不会出现在另一个选择下拉列表中

演示代码：

.margin-top-10{margin-top:1.0em；}
.margin-top-20{margin-top:2.0em；}
.margin-top-30{margin-top:3.0em；}

问题1
选择你的问题
选择问题1
选择问题2
选择问题3
选择问题4
问题2
选择你的问题
选择问题1
选择问题2
选择问题3
选择问题4
问题3
选择你的问题
选择问题1
选择问题2
选择问题3
选择问题4

如果更改代码中的select元素，使每个元素都有一个唯一的ID，您可能要做的第一件事是：它们目前都是sel1：）

然后，您需要将onchange事件绑定到select选项，以删除所选的选项。以下是一个例子：

$('select').on('change', function() {
  var elem = this;
  var option = this.value;
  $('.form-control option').each(function() {
    if ($(this).html() === option && $(elem).attr('id') !== $(this).parent().attr('id')) {
      $(this).remove();
    }
  });
})

您可能希望禁用用户使用相同的选择元素，或者存储删除的选项并在用户改变主意时将其添加回

我在我的示例中禁用了它们，您可以在这里查看。

---

到目前为止，您尝试了什么？请发布JS代码和更具体的错误/问题。谢谢谢谢代码，如果我想更改问题后选择了任何问题，我已经检查了您的代码。它不会重新选择EDI已更改已删除的选项，它工作正常。因为第一个选项是禁用的。