1

我想延迟特定网页的页面加载时间 - 在这种情况下是谷歌 - 以便用户在倒数计时器完成之前看不到网页。

这个问题受到xkcd的启发，类似的问题是“Javascript page load delay of specific set of pages”。

我尝试了 Jonathan 的 Greasemonkey 脚本的修改版本（见下文），但该脚本仅在第一次在特定选项卡中使用 Google 时延迟 Google 页面加载。

如果 Google 在新选项卡中打开，或者用户点击 Google 的链接然后返回，则脚本会再次启动。但是，如果用户从未离开过 Google（例如，他们在每个搜索结果下的简短摘要中找到了他们正在寻找的答案，然后只搜索其他内容），他们就可以毫不拖延地进行搜索。

有没有办法在每次搜索后强制显示延迟屏幕（而不是在每次访问页面后）？-- 最好使用 Greasemonkey 或 Chrome 插件？

当前使用的脚本：（
首先将阻止的地址设置为“1”，将所有其他地址设置为“0”，然后，如果 block>0，则脚本启动...）

(function(){
    // Note: This doesn't actually stop the page from loading, but hides it, so you know its 
    // there, waiting; The dopamine of internet candy becomes a torture.  Better to clean 
    // your room or open an irb prompt instead.
    window.seconds = 30;

    function resetCountDown()
    {
        seconds = 30;
    }

    // You can has cybersauce
    window.clearDelay = function()
    {
        document.getElementById('eightSixTwoDelay').style.display = 'none';
    }

    var overlay = document.createElement('div');
    overlay.id = 'eightSixTwoDelay';
    overlay.style.backgroundColor = '#000';
    overlay.style.color = '#FFF';
    overlay.style.fontSize = '56px';
    overlay.style.fontFamily = 'Helvetica, Arial, Sans';
    overlay.style.fontWeight = 'bold';
    overlay.style.textDecoration = 'none';
    overlay.style.position = 'absolute';
    overlay.style.top = '0px';
    overlay.style.left = '0px';
    overlay.style.width = '100%';
    // clientHeight changes as content loads, and JS, like the PHX Valley Metro system, does not wait for you to run.
    overlay.style.height = document.body.clientHeight + 'px'; //'100%'; 
    overlay.style.paddingTop = '10px';
    overlay.style.paddingLeft = '10px';
    overlay.style.textAlign = 'left';
    overlay.style.zIndex = '10000'; // OVER 9000

    overlay.addEventListener("click", resetCountDown, true); // THERE IS NO ESCAPE

    document.getElementsByTagName('body')[0].appendChild(overlay);

    window.displayDelay = function()
    {
        if (seconds > -1)
        {
            document.getElementById('eightSixTwoDelay').innerHTML = 'Page ready in ' + seconds + ' seconds.';
            seconds -= 1;
            setTimeout(window.displayDelay, 1000);
        }
        else
        {
            clearDelay();
        }
    }


    window.onload = displayDelay();

})();
}
4

1 回答 1

1

输入新搜索时，Google 会礼貌地更改 URL，并在新页面中进行 AJAXing。因此，请侦听该hashchange事件以确定何时运行新搜索。

关于该脚本的一些随机注释：

  1. 使用@run-at document-start以使消隐尽快开始。
  2. 覆盖应该是position: fixed;.
  3. 避免设置全局或window.范围变量，AMAP。

这是一个完整的脚本，可以在每次新的 Google 搜索时将页面空白：

// ==UserScript==
// @name        _Delay a page display, a la XKCD
// @namespace   _pc
// @match       http://*.google.com/*
// @run-at      document-start
// ==/UserScript==

/*--- Blank the screen as soon as the DOM is available, and also whenever
    the URL (hashtag) changes -- which happens when "new" pages are loaded
    via AJAX.
*/
window.addEventListener ("readystatechange",    FireWhenReady,          true);
window.addEventListener ("hashchange",          blankScreenForA_While,  true);

function FireWhenReady () {
    this.fired  = this.fired || false;

    if (    document.readyState != "uninitialized"
        &&  document.readyState != "loading"
        &&  ! this.fired
    ) {
        this.fired  = true;
        blankScreenForA_While ();
    }
}

function blankScreenForA_While () {
    /*  Note: This doesn't actually stop the page from loading, but hides it,
        so you know its there, waiting; The dopamine of internet candy becomes
        a torture.
        Better to clean your room or open an irb prompt instead.
    */
    //--- Settings:
    var pageDelaySeconds    = 5;
    var overlayID           = "gmEightSixTwoDelay"

    //--- One-time setup, for each new "page", START:
    function resetCountDown () {
        blankScreenForA_While.secondsRemaining  = pageDelaySeconds;
    }
    resetCountDown ();


    function createOverlay () {
        var overlay                 = document.getElementById (overlayID);
        if (overlay) {
            overlay.style.display   = 'block';  // Un-hide.
            return;
        }
        overlay                     = document.createElement ('div');
        overlay.id                  = overlayID;
        overlay.style.cssText       = "                                 \
            font:                   bold 56px Helvetica,Arial,Sans;     \
            text-decoration:        none;                               \
            position:               fixed;                              \
            top:                    0;                                  \
            left:                   0;                                  \
            width:                  100%;                               \
            height:                 100%;                               \
            z-index:                10000;  /* OVER 9000 */             \
            margin:                 0;                                  \
            overflow:               hidden;                             \
            color:                  pink;                               \
            background:             lime;                               \
            line-height:            1.5;                                \
            padding:                1em;                                \
            text-align:             center;                             \
        ";

        //--- Only use innerHTML the one time.
        overlay.innerHTML           = 'Go do something important!<br>'
                                    + 'Page ready in <span></span> seconds.'
                                    ;

        // THERE IS NO ESCAPE.
        overlay.addEventListener( "click", resetCountDown, true);

        document.body.appendChild (overlay);
    }
    createOverlay ();

    //--- One-time setup, for each new "page", :END


    // You can has cybersauce
    function clearDelay () {
        document.getElementById (overlayID).style.display = 'none';
    }


    function displayDelay () {
        if (blankScreenForA_While.secondsRemaining > -1) {
            var displaySpan         = document.querySelector (
                                        "#" + overlayID + " span"
                                    );
            displaySpan.textContent = blankScreenForA_While.secondsRemaining;

            blankScreenForA_While.secondsRemaining--;
            setTimeout (displayDelay, 1000);
        }
        else {
            clearDelay ();
        }
    }
    displayDelay ();

}//-- End of: blankScreenForA_While()
于 2012-05-27T23:37:00.280 回答