Можно ли добавить к URL-адресу css background в jquery?

Question

У меня есть фон для нескольких див, который вот так:

background: url('assets/bg_01.jpg');

каждого из которых имеет свой собственный номер 01 - 10. Теперь я хочу добавить к URL в JQuery, когда кнопка нажата, чтобы изменить его до bg_01_active.jpg и т. д. Можно ли добавить к URL-адресу переменную, или мне нужно установить ее вручную для каждого div?

Answer 1

<div class="asset_buttons" id="bg_01" style="background-image: url('assets/bg_01.jpg');">Test</div> 

$(".asset_buttons").click(function() {  
    $(this).css("background", "url('assets/" + $(this).attr('id') + "_active.jpg')"); 
}); 

Таким образом, вы бы 10 дивов с тем же классом, но различные идентификаторы в зависимости от их количества. Фрагмент JQuery изменит исходный адрес каждой из кнопок при нажатии на их идентификаторы.

Answer 2

Если я понимаю, что вы просите (вы хотите изменить цвет фона URL на кнопку мыши?), Это может быть сделано как этот

<div class='class', id='id'> </div> 
$('.class' //or '#id').on('click', function() { 
$(this).css('background-image', 'url(newer)'); 
}); 

https://jsfiddle.net/mahmudzero/anLL1uop/28/

Answer 3

Конечно вы не» t нужно сделать это вручную. В противном случае, для чего нужно программирование?

var src = "url('assets/bg_01.jpg')".split("."); 
$(element).css('background-image', src[0] + "_active." + src[1]);