Question

我有一个简单的代码块，应该显示一个Facebook图标：

<div class="icon">
    <a href="http://www.facebook.com" onclick="window.open(' https://www.facebook.com/','newwindow','width=600, height=300');return false;">
        <img src="https://content.t-three.co.uk/hubfs/tp-2017/Template%20refresh/Littlebooks/facebook.png" alt="Facebook"/>
    </a>
</div>

在页面上，它显示为损坏的图像，但是当我在JSFiddle中测试代码时，它有效吗？（图像为白色，可能需要拖动图像才能看到它）。

为什么会这样？

修改：

这是测试页面的[预览链接] [2]。

Answer 1

现在好了，链接更容易，你有安全和不安全的混合内容（即http和httpS）。转到浏览器的开发人员工具（通常是F12键），您将看到以下错误：

混合内容：＆＃39; https://preview.hs-sites.com/_hcms/preview/template/multi?is_buffered_template_layout=true&portalId=1870680&tc_deviceCategory=desktop&template_layout_id=5498485491＆＃39;是通过HTTPS加载的，但请求了一张不安全的图片＆＃39; http://content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png＆＃39;。此请求已被阻止;内容必须通过HTTPS提供。

要么所有都需要＆＃34; http＆＃34;或＆＃34; https＆＃34;，您不能混合2.您的浏览器认为您在安全页面上加载了不安全的内容。

所以：

<img src="httpS://...

Answer 2

<span id="hs_cos_wrapper_module_151499454550556" class="hs_cos_wrapper hs_cos_wrapper_widget hs_cos_wrapper_type_raw_html" style="" data-hs-cos-general-type="widget" data-hs-cos-type="raw_html"><!-- Facebook -->
<div class="icon">
    <a return="false" href="facebook.com" onclick="window.open(' facebook.com/', 'newwindow', 'width=600, height=300');
    return false;"> 
        <img src="//content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png"  srcset="//content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png">
    </a>
</div>
<!-- LinkedIn -->
<div class="icon">
    <a return="false" href="https://www.linkedin.com/company/t-three-consulting" onclick="window.open(' https://www.linkedin.com/company/t-three-consulting', 'newwindow', 'width=600, height=300');
    return false;">
        <img src="//content.t-three.com/hubfs/Images/Templates/Landing_Page/linkedin.png" alt="LinedIn" srcset="//content.t-three.com/hubfs/Images/Templates/Landing_Page/linkedin.png">
    </a>
</div>
<!-- Twitter -->
<div class="icon">
    <a return="false" href="https://twitter.com/tthreetweet" onclick="window.open(' https://twitter.com/tthreetweet', 'newwindow', 'width=600, height=300');
    return false;">
        <img src="//content.t-three.com/hubfs/Images/Templates/Landing_Page/twitter.png" alt="Twitter" srcset="//content.t-three.com/hubfs/Images/Templates/Landing_Page/twitter.png">
    </a>
</div>
<!-- GPlus -->
<div class="icon">
    <a return="false" href="https://www.facebook.com" onclick="window.open(' https://www.facebook.com/', 'newwindow', 'width=600, height=300');
    return false;">
        <img src="//content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png" alt="GPlus" srcset="//content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png">
    </a>
</div>
<!-- Email -->
<div class="icon">
    <a return="false" href="https://www.facebook.com" onclick="window.open(' https://www.facebook.com/', 'newwindow', 'width=600, height=300');
    return false;">
        <img src="//content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png" alt="Email" srcset="//content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png">
    </a>
</div>
<!-- Email -->
<div class="icon">
    <a return="false" href="https://www.facebook.com" onclick="window.open(' https://www.facebook.com/', 'newwindow', 'width=600, height=300');
    return false;">
        <img src="//content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png"  srcset="//content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png">
    </a>
</div></span>

也删除此代码

从第

页删除此脚本

<script type="text/javascript">
$( document ).ready(function() {

if(!$('.404-page').length)
{
  $(".hs-landing-page a[href*='facebook.com']").find("img").attr("src","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png").attr("srcset","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/facebook.png");
  $(".hs-landing-page a[href*='linkedin.com']").find("img").attr("src","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/linkedin.png").attr("srcset","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/linkedin.png");
  $(".hs-landing-page a[href*='twitter.com']").find("img").attr("src","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/twitter.png").attr("srcset","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/twitter.png");
  $(".hs-landing-page a[href*='plus.google.com']").find("img").attr("src","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/google-plus.png").attr("srcset","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/google-plus.png");
  $(".hs-landing-page a[href*='mailto:']").find("img").attr("src","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/email.png").attr("srcset","http://content.t-three.com/hubfs/Images/Templates/Landing_Page/email.png");
}

});
</script>

图像在网页上断开，但在其他地方测试时可以使用

2 个答案: