javascript - popstate HTML 5事件被多次触发

嗨，我正在使用以下代码使用jquery动态加载页面的一部分

loadNextBackInPage_URL = null;
function callBackFunctionLoadNextBackInPage(data)
{
    //alert(data);
    $("#left").fadeTo(100,1);
    var data = $(data).find( '#left' );
    $("#left").html(data);
    if(supports_history_api())
    {
        history.pushState(null, null, loadNextBackInPage_URL);
        window.addEventListener("popstate", function(e) {
        alert('s');
        loadNextBackInPage(location.pathname);
        });
    }
    else
    {

    }
}
function loadNextBackInPage(url,parm)
{
    //alert(url);
    loadNextBackInPage_URL = url;
    $("#left").fadeTo(100,.2);
    $.post(url,parm,callBackFunctionLoadNextBackInPage,'html');


}

加载部分甚至更改浏览器URL都在起作用。但是为什么会多次触发PoP状态函数？

我最初通过onclick函数调用loadNextBackInPage（）。

最佳答案

我在codingforums中从这里解决了


  认为你一直在添加“ popstate”
  听众一遍又一遍...
  
  程序逻辑：



页面已加载
onclick将执行loadNextBackInPage（）
启动$ .post（）请求，并在完成时触发“ callBackFunctionLoadNextBackInPage”
pushState（）
为“ popstate”注册一个事件监听器
当“ popstate”触发时，执行loadNextBackInPage（）并返回到步骤2



  因此，第4步将在
  通过它将注册新事件
  听众。每次“ popstate”开火
  所有事件监听器都将执行
  
  尝试移动addEventListener
  该循环外的方法调用


因此，我从中得出了一种解决方法，并将location.pathname更正为location.href

更正的代码：

loadNextBackInPage_URL = null;
popEventListnerAdded = false;


function callBackFunctionLoadNextBackInPage(data)
{
    //alert(data);
    $("#left").fadeTo(100,1);
    var data = $(data).find( '#left' );
    $("#left").html(data);
    if(supports_history_api())
    {
        history.pushState(null, null, loadNextBackInPage_URL);
        if(!popEventListnerAdded) {
            window.addEventListener("popstate", function(e) {
            loadNextBackInPage(location.href);
            });
            popEventListnerAdded = true;
        }

    }
    else
    {

    }
}
function loadNextBackInPage(url,parm)
{
    //alert(url);
    loadNextBackInPage_URL = url;
    $("#left").fadeTo(100,.2);
    $.post(url,parm,callBackFunctionLoadNextBackInPage,'html');
}

关于javascript - popstate HTML 5事件被多次触发，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/6151408/