Javascript 背景 URL 图像未显示在 Safari 浏览器上答案

【问题标题】：Javascript background URL image NOT showing up on Safari browserJavascript 背景 URL 图像未显示在 Safari 浏览器上
【发布时间】：2017-03-06 21:46:36
【问题描述】：

我正在尝试在 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 上显示两次？

【问题讨论】：

这在 safari codepen.io/anon/pen/vxXzOy?editors=1010 中对我有用。你能给我们一个工作演示吗？
我不能给你网址，因为这是一个客户网站，它的密码现在受到保护。除了客户和开发者之外，没有人可以访问它。
我不是要求您将我们链接到第 3 方网站。我要求您在 SO 上的帖子中重现该问题，并使用最少的代码来复制该问题。 “寻求调试帮助的问题（“为什么这段代码不起作用？”）必须包括所需的行为、特定问题或错误以及在问题本身中重现它所需的最短代码。没有明确问题陈述的问题对其他读者没有用。请参阅：如何创建minimal reproducible example。”
尝试将 ' 放在您的网址周围：style="background: url('htps://...') center center; 也许这会有所帮助。
我试过了，但没有运气。

标签： javascript css safari liquid

【解决方案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('"','')

【讨论】：