Unable to set background-image property in “beforeunload” event

问题

I'm trying to solve IE-problem of not animating a .gif image, when it is displayed in beforeunload or unload events. I step into this answer, but found it not working, so I played a little bit with this code.

I have come with something like that:

var
    spinner = $('.spinner-large'),
    spinnerBackgroundImage = spinner.css('background-image');

console.log(spinnerBackgroundImage);
console.log($('.spinner-large').css('background-image'));

spinner.css('background-image', spinnerBackgroundImage);

console.log(spinner.css('background-image'));

spinner.show();

This is not working. Spinner is displayed, but there is no background image. And console contains:

backend-extra.js:97     url(http://127.0.0.1/images/spinner-large.gif)
backend-extra.js:98     url(http://127.0.0.1/images/spinner-large.gif)
backend-extra.js:102    none

What am I missing? Why I can't set entire background-image property value with jQuery?

Note, that I don't want to set a path to image in background-image property, because I already know, how I should do this. I'm asking: Why background-image property value is reset to none, when I'm trying to change it with above method?

EDIT: Here is an jsFiddle for above problem. This seems to be 100% beforeunload event-related issue. When clicking button, the very same code works just fine, while when refreshing the page or navigating to any other URL, console have the same output like above -- property is not set.

回答1:

There should be quotes around the URL:

background-image: url("http(...)spinner-large.gif");

Invalid formatting is reason enough for it to turn into none. Otherwise it might be helpful to create a jsfiddle, codepen, something like that. It does not seem like obvious behavior.

Edit: this is beyond me, but it doesn't seem like your fault either. I'd suggest working around it. Possible even in an ugly way, like not animating the background on IE. (gracefully degrading should be okay anyway!)

来源：https://stackoverflow.com/questions/27505213/unable-to-set-background-image-property-in-beforeunload-event

标签

jquery

css

background-image

onbeforeunload