当从 IE11 中的 "onbeforeunload" 事件设置时，DOM 中未评估背景图像内联样式

Question

在 IE11 中从 "onbeforeunload" 事件处理程序设置背景图像时，DOM 会更新为正确的背景图像属性，但新图像不会反映在 window/frame.

在其他浏览器（包括其他版本的 IE）中按预期工作。

是不是我做错了什么，或者对 IE 和 onbeforeunload 不了解？

使用 JSFIDDLE，因为它在 Stack Overflow 代码片段中不起作用。

注意：点击 "Run" 触发 onbeforeunload 事件。

代码：

$(function () {
    var $bg = $('#bg');

    $bg.css("background-image", 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAGUlEQVQIW2NkwAIYCQn+Z2BgACsiqBJuEgA0oAEG+FuXFQAAAABJRU5ErkJggg==")');

    window.onbeforeunload = function (e) {
        $bg.css("background-image", 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAATklEQVQYV2O0O3X+PwMDA8MhM0NGEI0LMBKtEJsJD27YgW1R0DgEtwWrdUQrxGYLY8V5iDUdhghrKFOITfenmXFgW/jSF+H3DNEKsdkCAO99IAvSBrFVAAAAAElFTkSuQmCC")');

        return "Don't leave";
    };
});

#bg {
    width: 50px;
    height: 50px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<div id="bg"></div>

Answer 1

此问题可以通过在设置背景图像后强制 DOM 更新来解决。他们有很多方法可以实现这一点，但我从这个线程中借用了一些：jQuery CSS rendering - works in Firefox, not in Chrome

当从 IE11 中的 "onbeforeunload" 事件设置时，DOM 中未评估背景图像内联样式

Background image inline style isn't being evaluated in DOM when set from "onbeforeunload" event in IE11

javascript

internet-explorer-11