Установить фоновое изображение в CSS с помощью jquery

Я пытаюсь установить фоновое изображение для одного из элементов html, используя jquery

<div class="rmz-srchbg">
    <input type="text" id="globalsearchstr" name="search" value="" class="rmz-txtbox">
    <input type="submit" value="&nbsp;" id="srchbtn" class="rmz-srchico">
    <br style="clear:both;">
</div>

$("#globalsearchstr").focus(function(){
    $(this).parent().css("background", "url(/images/r-srchbg_white.png) no-repeat;");
});

но это никогда не работает. В фокусе происходит только изменение, так что атрибут стиля добавляется в HTML, например

<div class="rmz-srchbg" style="">

</div>

Никаких изменений в CSS не происходит.

Ответ 1

Попробуйте следующее:

<div class="rmz-srchbg">
    <input type="text" id="globalsearchstr" name="search" value="" class="rmz-txtbox">
    <input type="submit" value="&nbsp;" id="srchbtn" class="rmz-srchico">
    <br style="clear:both;">
</div>
<script>
$(function(){
   $('#globalsearchstr').on('focus mouseenter', function(){
    $(this).parent().css("background", "url(/images/r-srchbg_white.png) no-repeat");
   });
});
</script>

Ответ 2

Использование:

 $(this).parent().css("background-image", "url(/images/r-srchbg_white.png) no-repeat;");

вместо

 $(this).parent().css("background", "url(/images/r-srchbg_white.png) no-repeat;");

Другие примеры, которые вы видите в здесь

Ответ 3

попробуйте это

 $(this).parent().css("backgroundImage", "url('../images/r-srchbg_white.png') no-repeat");

Ответ 4

Попробуйте это

$("#globalsearchstr").focus(function(){
    $(this).parent().css("background", "url('../images/r-srchbg_white.png') no-repeat");
});

Ответ 5

Удалите точку с запятой после no-repeat, в url и попробуйте.

$("#globalsearchstr").focus(function(){
    $(this).parent().css("background", "url(/images/r-srchbg_white.png) no-repeat");
});

Ответ 6

Вам нужно удалить точку с запятой в строке правила css:

$(this).parent().css("background", "url(/images/r-srchbg_white.png) no-repeat");

Ответ 7

<div class="rmz-srchbg">
  <input type="text" id="globalsearchstr" name="search" value="" class="rmz-txtbox">
  <input type="submit" value="&nbsp;" id="srchbtn" class="rmz-srchico">
  <br style="clear:both;">
</div>

$(document).ready(function() {
  $('#globalsearchstr').bind('mouseenter', function() {
    $(this).parent().css("background", "black");
  });
});