не удалось изменить фоновое изображение с помощью jquery

Question

У меня есть файл css, путь которого - ресурсы/style/test.css и папка с изображением, путь которой - ресурсы/изображения/символы. об использовании следующего класса и HTML

.character 
{ 
position:relative; 
margin-top:-4.8%; 
margin-left:85%; 
height:51px; 
width:51px; 
background-color:#e3f4fd; 
background-image:url(../images/characters/9.png); 
background-position:center; 
background-repeat:repeat-y; 
} 

HTML:

<div class="character" style="display:inline-block;"> 
</div> 

он показывает мне требуемое изображение, но я хочу, чтобы изменить фоновое изображение с помощью JQuery и я пишу следующий URL при моих условиях

$ ('. Character', this) .css ("background-image", "url (../ images/characters/8.png)"); На экране не появляется

ничего ..

поэтому я хочу спросить, что должно быть URL, так что изображение, которое изменяется, отображается на экране?

Answer 1

предполагается, что файл HTML в корне, попробуйте

$('.character', this).css("background-image", "url(resources/images/characters/8.png)"); 

Answer 2

Я уверен, что проблема заключается в вашем селекторе JQuery, попробуйте удалить контекст параметры:

$('.character', this) to $('.character') 

Answer 3

для этого синтаксиса, вы должны использовать имена верблюжьих свойств:

изменения

$('.character', this).css("background-image", "url(../images/characters/8.png)"); 

до

$('.character', this).css("backgroundImage", "url(../images/characters/8.png)");