Question

我尝试改变身体＆＃39;单击按钮时的元素背景，但没有任何反应，并且Chrome浏览器控制台中未返回任何错误。我尝试了多种方法。对于方法1 ，我还尝试将背景替换为 background-image 。在CSS代码中，已经分配了背景图像。

JS代码：

$('.btn').click(function(){
    //method1:
    $('body').css({backgroundImage: 'url:(https://working-url)'});
    //method2:
    $('body').css('background', 'url:(https://working-url)');
}

CSS代码引用＆＃39; body＆＃39;：

html,
body {
 margin: 0;
 padding: 0;
}

body {
 color: #F0F8FF ;
 background: url("back.jpg") no-repeat center center fixed;
 background-size: cover;
 font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;

}

Answer 1

当使用速记分配背景是CSS时，你必须要小心，这意味着在一行中分配所有背景属性。如果稍后再分配另一个背景，它将覆盖所有这些属性。这意味着，由于您只是添加图像，no-repeat center center fixed将不会转移到新背景。您需要单独设置这些属性，并仅更改background-image。

至于你想要像这样定位的jQuery：

$('body').css('background-image', 'url(https://working-url)');

或

$('body').css({'background-image': 'url(https://working-url)'});

Answer 2

试试这个：

HTML按钮部分：

<button>Change background</button>

JQUERY Part：

$('button').click(function(){
   $('body').css('background-image','image.jpg');
});

如何设置＆＃39; body＆＃39; JQuery中的背景

2 个答案: