4

我有这个代码：

var $msg = jQuery('<div></div>')
    .hide()
    .appendTo(document.body)
;
if ($msg.is(":hidden")) {
    console.log("hidden");
} else {
    console.log("visible");
}

运行时，它会登录"hidden"Firefox，但会登录"visible"Google Chrome。这是一个错误，还是我做错了什么？

4

2 回答 2

4

您是否尝试将其附加到正文后隐藏？

$(function() {
    var $msg = jQuery('<div>hello</div>').appendTo(document.body).hide();
    if ($msg.is(":hidden")) {
        console.log("hidden");
    } else {
        console.log("visible");
    }
}); // $()

在两种浏览器上都为我工作。

于 2009-01-12T07:19:39.950 回答
0

正如 eed3si9n 所说，这是.hide()通话在通话之前.appendTo()。

我想我会添加这个答案，因为我发现了另一种也可以使用的方法：

jQuery('<div></div>')
    .css("display", "none")
    .appendTo(document.body)
;

我不确切知道它是否像这样工作，但我想将元素添加到隐藏的 DOM 应该更快，因为浏览器不需要渲染它？

对于那些像我一样并且必须确切知道事情是如何运作的人的更新：

jQuery.hide() 的代码 - 我添加的评论

hide: function(speed,callback){
    return speed ?

        // this block of code won't be run, since speed will be undefined
        this.animate({
            height: "hide", width: "hide", opacity: "hide"
        }, speed, callback) :

        // this is the relevant code
        this.filter(":visible").each(function(){
            this.oldblock = this.oldblock || jQuery.css(this,"display");

            // you can see here that it merely sets the display to 'none'
            this.style.display = "none";
        }).end();
}

这是选择器的代码:hidden：

hidden: function(a) {
    return "hidden" == a.type                        // <input type="hidden" />
        || jQuery.css(a, "display") == "none"        // style.display = none
        || jQuery.css(a, "visibility") == "hidden";  // style.visibility = hidden
}

This doesn't really explain why Chrome isn't showing the element as hidden though...

于 2009-01-12T07:26:27.580 回答