Question

我正在建立一个看起来像这样的网站（http://brandonbarber.co/）。

我有以下代码用于检测linkedin div上的点击，然后重定向。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        $("#linkedin").click(function(){
            window.location.href = "https://www.linkedin.com/in/brandon-barber-79043593/";
            return false;
        });
    });
</script>
<body>
<div id="banner">
<div class="menubutton" id="home">Home</div>
<div class="menubutton" id="circuitry">Circuitry</div>
<div class="menubutton" id="programming">Programming</div>
<div class="menubutton" id="stackoverflow">Stackoverflow</div>
<div class="menubutton" id="linkedin">Linkin</div>
</div>

但是当我点击div时，它会重定向到空白页面。

我错过了什么？

Answer 1

出现此问题的原因是您的整个网站都由框架/ iframe组成，因此当您使用window.location.href =“https://www.linkedin.com/in/brandon-barber-79043593/”时，您将提示浏览器在iframe中打开该页面源代码允许，在这种情况下是linkedin。 Refused to display 'https://www.linkedin.com/in/brandon-barber-79043593/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.

要解决此问题，您需要使用window.open而不是window.location，例如： window.open('https://www.linkedin.com/in/brandon-barber-79043593/', '_blank');

在旁注中，我建议不要将iframe作为页面的源内容，而是为您的域设置一个指向您的IP的CNAME，因为IP会在DOM中同时公开。

Answer 2

这实际上是合法的代码。

我将其完全复制到我的服务器上并且可以正常工作！

http://lespointscom.com/a/misc/demo/2016_06_18/jquery.html

也许你的网络连接......

nnnnnn是对的，这是你的框架！

来自Mozilla：

X-Frame-Options拒绝加载：https://www.linkedin.com/in/brandon-barber-79043593/不允许跨源框架。

window.location.href重定向到空白页面

2 个答案: