我几乎完全开发了一个小项目,它访问Twitch API以显示流的在线/离线状态,作为FreeCodeCamp课程的一部分。
您可以在此处查看项目:https://codepen.io/MikeLuDev/pen/qXVarP
获取API结果后,我使用以下代码为每个结果创建一个新链接:
let newLink = $("<a></a>");
newLink.prop({id:linkID,
class:linkID + " " + isOnline,
href:"https://www.twitch.tv/" + stream,
target:"_blank",
rel:"noopener"
});
$("#content").append(newLink);
我已在最新版本的Firefox和Chrome上测试了这一点。在Chrome上,该程序按预期工作。但是,在Firefox上,链接将在新选项卡中打开,但页面永远不会显示,只显示白屏。这发生在我的办公室电脑,家用台式机和手机上。尝试打开链接时,控制台中没有任何奇怪的内容。
删除以下行时
target:"_blank",
rel:"noopener"
并通过单击页面正确加载的鼠标中键在新选项卡中打开链接。
这是否有解决方法?
编辑:我还应该补充一点,当前两行仍在代码中并且使用鼠标中键时,页面会正确打开。
edit2:这是image of my screen when opening a new link
edit3:我想到了它是我的广告拦截器的可能性。禁用后问题仍然存在。