更改背景图片网址

Question

I am trying to change the background of the input button when clicked by using jquery but for the life of me, can't figure out the relative path to make it work.

js file is in root/js folder css file is in root/css folder

My code looks like this:

jQuery($button).css('background',"url(../images/updating_button.gif)");

But this just doesn't work...it can't find the image with that path. if I use absolute path it works obviously but i really need it to be relative.

I have tried all combination that I know like:
/images/updating_button.gif
..images/updating_button.gif
images/updating_button.gif
updating_button.gif

Answer 1

If the URL is static, you could declare a class with the background and maintain your relative path.

In your CSS:

.updating { background: url(../images/updating_button.gif); }

In your JS:

jQuery($button).addClass('updating');

Answer 2

You are aware that paths in any inline styles (whether set with JS or not) will be relative to the current HTML document (the URL on the browser's URL bar), not any other file, right?

And why are you avoiding absolute (or domain-relative) URLs?

Answer 3

以下代码可能对您有用：

 jquery("button").css("background-image","url(menubar/ajax-loader.gif)");

Answer 4

I wish I could test this for you, but I've had some issues with the url property in the past; adding single quotes inside the url() has proved to be the most reliable with relative paths.

jQuery($button).css('background',"url('../images/updating_button.gif')");

Also, what does your file structure look like?