Question

我不认为这个主题提供了很好的解释......

嗯，我想做的概念很简单。我希望在执行某些操作之前显示一个屏幕叠加层，然后在此之后消失。

我尝试使用jQuery.show（）/ jQuery.hide（），但没有成功。

CSS

#ExtensionLoading {
    background: #000;
    width: 100%;
    min-height: 100%;
    position: fixed;
    z-index: 9999;
    display: none;
    opacity: .5;
}

的JavaScript

Helpers.blackout( 'show' );

$( JSON.parse( Cookie.read( 'ListOfThings' ) ) ).each( function() {

    $( '#content' ).html(

        $( '#content' ).html().replace(

            new RegExp( this.itemText, 'g' ),

            '<a href="' + Helpers.url( { 'mod': 'items', 'p': this.itemID } ) + '">' + this.itemText + '</a>'
        )
    );
});

Helpers.blackout( 'hide' );

这是有问题的代码。但是，它不是一个独立的代码。

助手

function Helpers() {}

Helpers.blackout = function( action ) {

    if( $( 'body' ).has( 'div#ExtensionLoading' ).length == 0 ) {

        $( 'body' ).prepend( '<div id="ExtensionLoading"></div>' );
    }

    if( action == 'show' ) {

        $( '#ExtensionLoading' ).show();

    } else if( action == 'hide' ) {

        $( '#ExtensionLoading' ).hide();
    }
};

JSON操作由[Douglas Crockford的剧本] [1]

完成

[1]：https://github.com/douglascrockford/JSON-js/blob/master/json2.js和Cookie只是一个Cookie对象，没什么特别的。

如果我评论负责隐藏元素的行，一切正常。出现覆盖屏幕，通过其不透明度，我可以看到正在应用的例程。

但是，很明显，屏幕叠加并没有消失，因为我并没有告诉它消失。但如果我取消注释该行，则屏幕不再出现。

这很奇怪。这就像是在“show”之后立即调用“hide”。我想是这样的，因为如果我在Helpers对象中将hide（）更改为：

$( '#ExtensionLoading' ).hide('slow' );

我可以很快看到叠加层出现并在替换发生前几秒消失。

屏幕叠加和执行操作

0 个答案: