在CSS中使用jquery设置背景图像

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (72)

我试图使用jQuery为我的html元素之一设置背景图像。

<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中不会发生任何更改。

提问于
用户回答回答于

试试这个:

<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>
用户回答回答于

用:

 $(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;");

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励