Internet Explorer 中的选项标签显示块/无

Question

这是我的 previous question 的另一个问题。

我有一个完美的代码 (DEMO)，它可以按预期工作。但这在 Chrome 和 firefox 中运行良好，但在 Internet Explorer 中却不行。那是因为 IE 不支持disply: none/block 选项标签。

为了解释功能的流程，

• 主标签和子标签是两个不同的部分，具有相同的列表值
• 同一项目不应出现在两个部分中。当用户从Main tag 中选择Item 1 时，应从Sub Tag 列表中删除相同的项目。
• Sub Tag 有一个名为Selected sub Tags 的部分，其中选定的子标签将显示为标签。当我们删除这些选定的标签时，它应该会重新显示在Sub Tag 列表中
• 如果用户在Main tag 列表中选择不同的项目（例如：Item 2），它应该切换Sub Tag 列表中的remove/add。意味着，删除当前选中的项目 (Item 2) 并将之前删除的项目 (Item 1) 添加回 Sub Tag。如果已在 Selected Sub Tags 列表中选择了 Item 2，则它也应从 Selected Sub Tags 列表中删除

我只需要让给定的代码在 Internet Explorer 中工作。

或者有什么方法可以使用 ul li 而不是列表项获得相同的功能？

Answer 1

只是隐藏一个选项有点没有意义。有一些浏览器（在您的情况下为 Internet Explorer）无法做到这一点。处理所有浏览器的最佳方法是实际从 DOM 中删除该选项，而不是隐藏它。

您想在演示中找到一些有趣的东西吗？选择Tag 1 作为主标签。然后选择Tag 2 作为子标签。现在在你的键盘上玩向上和向下箭头，感受魔法。那么现在，您真的可以说这是一个按预期工作的完美代码吗？

如果你想有一个工作代码，你必须在选择中删除和添加选项。隐藏选项太奇怪了，浏览器（甚至是 firefox 和 chrome）并不真正支持。