Javascript 背景 URL 图片未显示在 Safari 浏览器中

Question

我正在尝试在 Javascript 中显示产品图片，如下所示：

  <script>
      $(document).ready(function(){

        var image,caption;

        function sectionHtml(caption,image){
          return '<div class="mason-image" style="background: url('+image+') center center; background-size: cover;"><h3>'+ caption +'</h3></div>';
        }

        caption = $($('.image-bar__item')[0]).text()
        image = $($('.image-bar__item.image-bar__link')[0]).css('background-image').replace('url("','').replace('")','')


// More stuff here, not related to image
 });
</script>

图像在 chrome 和 Internet Explorer 上显示效果很好，但在 Safari 上显示不出来。

以下是检查代码在 Chrome 开发工具上的样子：

这是 Safari 开发者控制台上显示的内容：

"url" 部分在 safari 中出现了两次，这就是它崩溃的原因。有什么办法可以解决这个问题，让它不会在 Safari 上出现两次吗？

Answer 1

这是我必须做的才能让它工作：

'<div class="mason-image" style="background: url(' + image + ') center center;"></div>';

image = $($('.image-bar__item.image-bar__link')[0]).css('background-image').replace('url','').replace('(','').replace(')','').replace('"','').replace('"','')

Javascript 背景 URL 图片未显示在 Safari 浏览器中

Javascript background URL image NOT showing up on Safari browser

javascript

css

safari

liquid