javascript - 内容更改后强制刷新页面

Question

我有一个充当指示器的按钮，因此有两种状态；按下它可以切换状态，然后进入下一页。

按下按钮会调用一个 JavaScript 函数来处理此问题。

使用 jQuery 更改按钮的“src”图像后，我希望用户能够看到图像更改，暂停一小会儿，然后才能看到显示的下一页。

我发现在 JavaScript 函数返回之前图像不会发生明显变化，但这是在暂停之后以及页面更改之后。 IE。在按钮功能退出之前，浏览器不会显示页面更改。

所以我希望在暂停之前在浏览器中重新绘制页面。 我尝试过的所有解决方案都将页面刷新到服务器上的状态，并且我在 jQuery 中对其所做的任何更改都会丢失。

有没有办法强制重新绘制页面或按钮，这将遵循我在 JavaScript/jQuery 中对其所做的更改？

Answer 1

$("#YourButtonWhichTriggersChanges").click(function() {
    // page repaint code, image change, etc.

    setTimeout(function(){
        window.location.reload();
        // use window.location.href = "my/new/url.html";
        // or window.location.replace("my/new/url.html");  
        // to change the page instead of just reloading.
    }, 1000);
});

其中 1000 是刷新页面之前要等待的毫秒数。

<小时/>

编辑:我想你想要这个代码:

$("#ApproveButton").css('backgroundImage', 'url(\'img/but/proof/ApprovePageButton.png\')');

额外的反斜杠是为了转义 url 参数中的单引号。

<小时/>

另一个编辑:这是我提供的两个解决方案的组合，应该有效:

$("#ApproveButton").click(function() {
        // actually repaint the button's background image
        $(this).css('backgroundImage', 'url(\'img/but/proof/ApprovePageButton.png\')');

        // change the page after 1000 milliseconds have gone by.
        setTimeout(function(){
            window.location.reload();
            /* use window.location.href = "my/new/url.html";
             * or window.location.replace("my/new/url.html");  
             * to change the page instead of just reloading.
             */
        }, 1000);
    });