使用 jQuery 在 IE 中隐藏选择选项

IT技术 javascript jquery html-select
2021-02-01 23:57:10

目前我正在使用 jQuery 使用以下代码隐藏/显示选择选项。

$("#custcol7 option[value=" + sizeValue + "]").hide();

这在 Firefox 中运行良好，但在其他浏览器中没有任何好处。如何在 Chrome、Opera 和 IE 中隐藏选项？

6个回答

我刚刚遇到了这个，而不是一遍又一遍地克隆整个选择，我只是用span元素替换了需要隐藏的选项并隐藏了跨度（尽管浏览器并没有在视觉上显示它们，我认为） - 你可能需要改变您的代码（如果复杂）遍历复杂逻辑的跨度。

跨度存储对 的引用，option并在需要显示时用它替换自己。

这段代码显然可以重构和美化。

http://fiddle.jshell.net/FAkEK/12/show/

编辑#2（使用这个代替）：我突然想到，不要做所有这些克隆/引用/替换废话，只需用跨度包裹选项，隐藏跨度，然后在节目中再次用选项替换跨度。 .

http://fiddle.jshell.net/FAkEK/25/show/

我可以确认这是解决方案！虽然不符合HTML5，但它确实有效。
2021-03-24 23:57:10
你是个很棒的人！！对我来说就像一个魅力！所以这意味着 show() 实际工作只有 hide() 在 IE 中不起作用。非常感谢！
2021-03-25 23:57:10

我认为meder提供了有效的答案，这里略有更改以反映对我有用的内容：

$.fn.optVisible = function( show ) {
    if( show ) {
        this.filter( "span > option" ).unwrap();
    } else {
        this.filter( ":not(span > option)" ).wrap( "<span>" ).parent().hide();
    }
    return this;
}

测试（BrowserStack 万岁）：

  • Windows XP：IE 6.0、Firefox 3.0、Safari 4.0、Opera 10.0、Chrome 14.0
  • Windows 8：IE 10.0 Metro
  • iOS 3.2 (iPad)、iOS 6.0 (iPhone 5)
  • 安卓 1.6（索尼 Xperia X10）

提琴手

使用此方法在选择器上使用 .val() 时要小心，因为它会返回隐藏值而不是选定值。提琴手
2021-03-26 23:57:10

你不知道，它在 IE 中不受支持（大概也不在 Chrome 或 Opera 中）。如果您希望它们真正不可见，则必须完全删除这些选项，然后再将其添加回来。但在大多数情况下，一个简单的disabled="disabled"就足够了，而且比处理删除和添加选项要简单得多。

@Mark：认真的......他们为什么还要打扰？
2021-03-16 23:57:10
IIRC，您不能禁用 IE6 或 IE7 中的选项（在 IE8 中已修复）webbugtrack.blogspot.com/2007/11/...
2021-03-27 23:57:10
呜呜呜！！！我非常讨厌 IE。他们什么都做不好！！默认情况下，无缘无故的文本框和密码框的宽度甚至都不相同！？圆角不起作用？什么都没有正确排列......我不明白！
2021-04-07 23:57:10
为清楚起见，关于“禁用”方法，在 jQuery 中，该代码将是 $("#custcol7 option[value=" + sizeValue + "]").prop('disabled', true);
2021-04-11 23:57:10

尝试分离（）。如果需要，您可以稍后使用 append() 或 insertAfter() 重新附加它

这样做的问题是，如果您想隐藏菜单中间的特定选项，那么尝试将它们插回原来的位置就太费事了。
2021-03-17 23:57:10
有趣......不知道这个功能:-)
2021-03-23 23:57:10

要删除选项，请使用：

var opt=$("option").detach();

要显示选项，请使用：

opt.appendTo( "select" );
这似乎是有效的 HTML 和简单优雅的解决方案。opt将是一个option元素数组，可以select使用 appendTo添加回元素。我希望这个答案可以被提升或被选为最佳答案，因为那里的其他解决方案只是让我离开了一段时间，并且要么有效要么直接向前。谢谢萨钦。
2021-04-11 23:57:10
其它你可能感兴趣的问题
上一篇如何从键值对数组创建对象？ 下一篇如何在 ES6 中解构为动态命名的变量？