7

任何人都知道javascript中jquery的.show()等价物是什么?

我尝试使用 document.getElementById 并添加/删除我命名为“show”//“hide”的类,但效果不佳我不确定这些类中可能有错误的属性..

表演课是:

.show{
    position:relative;
    display:block;
}

隐藏类是:

.hide{
    position:absolute;
    top:0px;
    right:0px;
    display:none;
}

我很确定有更好的方法。

4

5 回答 5

19
document.getElementById('myElement').style.display = 'block'; // show
document.getElementById('myElement').style.display = 'none'; // hide
于 2012-08-15T05:11:16.693 回答
6

jQuery 考虑了display隐藏之前的值。当您触发show()时,它会将其返回到该值。因此,它不仅仅是简单地将元素的display属性设置为blockand none

所以基本上:

function hide(){
    //get previous display value
    //store it in an internal cache. jQuery has an internal data storage
    //hide element
}

function show(){
    //get previous display value for that element
    //apply to element to show it
}

.show()

匹配的元素将立即显示,没有动画。这大致相当于调用.css('display', 'block'),除了显示属性恢复到最初的状态。如果一个元素的显示值为inline,则隐藏并显示,它将再次内联显示。

于 2012-08-15T05:16:34.347 回答
0

采用document.getElementById("MyId").className='show' document.getElementById("MyId").className='hide'

于 2012-08-15T05:11:49.583 回答
0

尝试使用 document.getElementsByClassName,因为您使用的是 .show 和 .hide。这些是类,您正试图按 Id 定位。免责声明:您可能需要仔细检查旧浏览器对此的支持。

于 2012-08-15T05:13:27.210 回答
0

在使用 jQuery 之前,我使用以下方法来显示/隐藏元素:

HTMLElement.prototype.toggleDisplay = function(on_or_off, display_type) {
    if (typeof(tddisptype) == "undefined") tddisptype = "block";
    var new_display;
    if (typeof(on_or_off) != "boolean") {
        if (this.style.display == "none") new_display = display_type;
        else new_display = "none";
    } else {
        if (on_or_off) new_display = display_type;
        else new_display = "none";
    }
    this.style.display = new_display;
}​

这会为所有元素添加一个 toggleDisplay() 函数;例如,您可以通过 document.getElementById() 获得。您可以传递它truefalse作为参数来显示或隐藏元素,或者如果您不传递参数,它会尝试确定是显示还是隐藏元素。第二个参数指定与“开”状态相关的显示类型;上面,它默认为block.

于 2012-08-15T05:17:39.540 回答