web-dev-qa-db-fra.com

Définir l'image d'arrière-plan en CSS à l'aide de jquery

J'essaie de définir l'image d'arrière-plan pour l'un de mes éléments html à l'aide de 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;");
});

mais cela ne fonctionne jamais. Sur le focus, seul le changement se produit, c'est qu'un attribut de style est ajouté au HTML, comme ceci

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

</div>

Aucun changement de CSS ne se produit.

javascriptjqueryhtmlcss
16
Athul

Essaye ça:

<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>
22
Ringo

Utilisation :

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

au lieu de

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

Plus d'exemples que vous pouvez voir ici

10
Aditzu

essaye ça

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

Essaye ça

$("#globalsearchstr").focus(function(){
    $(this).parent().css("background", "url('../images/r-srchbg_white.png') no-repeat");
});
2
Amit
<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");
  });
});
1
sumit negi

Vous devez supprimer le point-virgule dans la chaîne de règles css:

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

Retirez le point-virgule après no-repeat, dans l'url et essayez-le.

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