使用 jQuery CSS 属性更改背景图像无效

Question

我尝试了 this thread 上投票最多的答案，但它对我不起作用。

Most voted answer 说：

You probably want this (to make it like a normal CSS background-image declaration):
$('myOjbect').css('background-image', 'url(' + imageUrl + ')');

这是 JS 代码：

$('.icon-menuoption').click(function() {

$('.menu').animate({
  left: "-285px"
}, 200);


$('body').animate({
  left: "0px"
}, 200);

$('jumbotron').css('background-image', 'url(' + /images/bg_v3.png + ')');

});

菜单和主体按预期移动，但超大屏幕的背景图像没有。我在图像目录中确实有 bg_v3.png 图像，它与此 JS 代码位于同一目录中。

没有这部分：

$('jumbotron').css('background-image', 'url(' + /images/bg_v3.png + ')');

它做了它应该做的，但我也想改变 background-image。

注意：我是一个彻头彻尾的菜鸟。我是通过codeacademy学习的，对JS、jQuery和CSS知之甚少所以请尽可能详细。

谢谢！

Answer 1

这行代码中有两处需要更正：

$('jumbotron').css('background-image', 'url(' + /images/bg_v3.png + ')');

首先，select或$('jumbotron')不会select任何元素。它 returns null，因此调用 .css 函数将导致错误。如果您的定位元素具有 ID = 'jumbotron'，则 select 或应更改为 $('#jumbotron')。如果该元素有 CSS class of .jumbotron，那么 selector 应该是 $('.jumbotron').

其次，您的 'url(' + /images/bg_v3.png + ')' 部分还会导致另一个错误。这应该是 'url(/images/bg_v3.png)'.

使用 jQuery CSS 属性更改背景图像无效

Changing background-image with jQuery CSS property is not working

css

jquery

background-image

使用 jQuery CSS 属性 更改背景图像无效

Changing background-image with jQuery CSS property is not working

css

jquery

background-image

使用 jQuery CSS 属性更改背景图像无效