javascript - 更改背景图像 css 导致添加额外的 div

Question

我正在根据原始 HTML 模板在 Blade.php 中创建一个模板。当我尝试更改背景图像的 URL 时，而不是更改它，它会为样式创建一个额外的 div，例如 this，这会导致其他模板化背景属性，例如position或被size忽略。我该如何解决这个问题？

<div data-bs-parallax-bg="true" id="pic_promo_1" style="background-image: url(#); height: 500px; background-position: center; background-size: cover;"></div>

if ($('#pic_promo_1').length) {
  $('#pic_promo_1').css('background-image', 'url({{asset("/images/products/$products->pic_promo_1")}})')
}

标签： javascriptjqueryhtmlcsslaravel-blade

Answer 1

像这样写

if ($('#pic_promo_1').length) {   
  var imageUrl = "/examples/images/sky.jpg";
  $("#pic_promo_1").css("background-image", "url(" + imageUrl + ")");
}