Div 不被过滤为 :hidden 当 display:none;作为样式附加答案

【问题标题】：Div's are not filtered as :hidden when display:none; is appended as styleDiv 不被过滤为 :hidden 当 display:none;作为样式附加
【发布时间】：2010-05-21 18:17:13
【问题描述】：

我有一些简单的 HTML：

<div id="selectorContainer">
    <div id="chainedSelector" style="display: none;"><% Html.RenderPartial("ProjectSuggest/ChainedProjectSelector"); %></div>
    <div id="suggestSelector"><% Html.RenderPartial("ProjectSuggest/SuggestControl", new SuggestModeDTO{RegistrationMode = Model.RegistrationMode}); %></div>
</div>

这是控件的两个容器。我有 jQuery 代码可以在显示这些之间切换，但我需要将上次用户登录时使用的 cookie 存储为 cookie（即哪个是可见的）。 cookie 的存储不是问题。

问题是我由于某种原因无法使用 .is(":hidden") 检测到哪一个是隐藏的，并且无法使用 .is(":visible" 检测到哪个是可见的)

当我使用这两个选择器时，我总是同时得到。两者都为“true”和“true”，尽管其中一个具有 display: none;而另一个没有。请注意，它们不会放置在隐藏容器中，否则会隐藏两者，因此没有任何隐藏的祖先容器。

谁能解释为什么会发生这种情况？

jQuery 代码包含获取 ID 和获取所选 ID 的源代码（目前已损坏）：

getChainedSelectorId: function() {
    return "#chainedSelector";
},

getSuggestSelectorId: function() {
    return "#suggestSelector";
},

getSelectedSelector: function() {
    alert($(this.getChainedSelectorId()).is(":hidden"));
    alert($(this.getSuggestSelectorId()).is(":hidden"));
    var selected = ($(this.getChainedSelectorId()).is(":visible") ? this.getChainedSelectorId() : this.getSuggestSelectorId());
    alert(selected);
    return selected;
},

提前致谢。

【问题讨论】：

标签： jquery css jquery-selectors

【解决方案1】：

我刚刚用上面的 html 运行了以下代码，它运行良好：

<script type="text/javascript">
testobj = {
getChainedSelectorId: function() {
    return "#chainedSelector";
},

getSuggestSelectorId: function() {
    return "#suggestSelector";
},

getSelectedSelector: function(){
alert($(this.getChainedSelectorId()).is(":hidden"));
    alert($(this.getSuggestSelectorId()).is(":hidden"));
    var selected = ($(this.getChainedSelectorId()).is(":visible") ? this.getChainedSelectorId() : this.getSuggestSelectorId());
    alert(selected);
    return selected;    
    }
}
$(function() {
    testobj.getSelectedSelector();
});


</script>

局部视图中呈现的是什么？

【讨论】：

我只是尝试删除部分，并在一个 div 中输入文本“ole”，在另一个 div 中输入“flemming”。那行得通。然后我把部分放回去，它们也起作用了。显然出了什么问题是一些浏览器缓存。 grr 很抱歉浪费了您的时间。
没问题...我实际上了解了我以前从未使用过的 .is() 方法，所以它一点也不浪费:)

【解决方案2】：

:hidden 用于 CSS 属性 visibility:hidden

我觉得……

【讨论】：

:hidden 是一个 jQuery 选择器，实际上更接近于匹配 display: none; :)