jquery - 历史浏览器翻倍

Question

我有问题。
这是一种情况：我有一个 iframe，里面有一个网站。我也有播放器的包装。
我需要这个单例播放器，当用户通过网站上的链接访问时，它不会停止或刷新。
使用 postMessage 在包装器和 iframe 之间进行可爱的对话，我尝试触发历史更改（onpopstate），因此如果用户单击“转发”的“返回”，我的 iframe 会重新加载。
我不明白为什么我的活动只在故事的第一页有效（可能不是。我仍然不明白）。WHYYY OMG为什么历史的每一个状态都在那里翻倍？
像这样：

1. 音乐集
2. 艺术家
3. 艺术家编号 34786
4. 搜索页面
5. 返回（现在我应该有一个艺术家页面。我的 iframe 正确刷新，但包装器具有相同的 url 和标题）
6. 再次返回（现在更改包装器的 url）

这是我的触发器代码。请告诉我这种不良行为的原因是什么？

包装面

var zaya = document.getElementById("iframe").contentWindow;

window.onpopstate = function(data) {
    zaya.postMessage({
        name: "popstate",
        url: window.location.host + window.location.pathname
    },
        "http://urlofwebsite.com"
    );

    alert("location: " + document.location + ", state: " + JSON.stringify(event.state));
};

iframe 侧

function listenerIF(data) {
    var info = data.data;

    if (data.origin !== "http://urlofwebsite.com") return;

    if (info.name === "popstate") {
        document.location = info.url;
    }
}

if (window.addEventListener) {
    window.addEventListener("message", listenerIF, false);
} else {
    window.attachEvent("onmessage", listenerIF);
}

但是这个触发器无论如何都不起作用......

Answer 1

我从来不知道 iframe 会将其历史状态添加到主要历史中。所以我这样修复它：

$("a").on("click", function(e){
        e.preventDefault();
        var neededUrl = this.getAttribute('href');
        /*here is a code with postMessage to wrapper So there will be pushState()*/
        window.location.replace(neededUrl);
    });