相关疑难解决方法(0)

我必须检测用户是否点击了后退按钮.为此,我正在使用

window.onbeforeunload = function (e) {
}

如果用户单击后退按钮,它可以工作.但是,如果用户单击F5或重新加载浏览器按钮,也会触发此事件.我该如何解决？

有没有办法使用JavaScript(或其他东西)来检测/阻止用户点击浏览器后退/前进按钮？

我想知道处理这个问题的常见做法.这真的很痛苦,特别是在订购等工作流程中.

是否可以通过浏览器中的历史记录返回按钮检测用户是否输入了页面？我希望用聚合物检测这种作用.

我有一个自定义弹出功能。我想要的是浏览器后退按钮以关闭此弹出窗口。

我理想的情况是不要在网址栏中显示主题标签。

我试图把window.history.pushState('forward', null, '');我的showPopup()功能，然后执行以下操作：

$(window).on('popstate', function () {
    closePopup();
});

确实可以，但是问题是当我手动关闭弹出窗口时，必须按两次后退按钮才能导航回到上一页（显然是因为打开弹出窗口时添加了浏览器历史记录条目）。

最好的方法是什么？是否可以在不添加浏览器历史记录条目的情况下完成？本质上，我想做的是复制移动应用程序的行为。在移动应用中按返回按钮通常会关闭所有打开的模式或上下文菜单。

$(window).on('popstate', function () {
    closePopup();
});

$('.popup-link').click(function() {
    showPopup();
});

$('.popup-close').click(function() {
    hidePopup();
});

function showPopup() {
    $('.popup').addClass('active');
}

function hidePopup() {
    $('.popup').removeClass('active');
}

.popup {
  background-color: #ccc;
  width: 300px;
  height: 300px;
  display: none;
}

.popup.active {
    display: block;
}

我正在开发一个项目,我需要处理浏览器后退按钮,然后点击它我想重定向到主页.

我经历了很多帖子,有很多方法可以实现它.

我想知道,实施它的最佳方法是什么.

如果有人知道类似的帖子,请发布网址.

感谢帮助

我使用了以下代码:

function HandleBackFunctionality()
{
    alert('ckikc')
    if(window.event)
    {
        if(window.event.clientX < 40 && window.event.clientY < 0)
        {
            alert("Browser back button is clicked...");
        }
        else
        {
            alert("Browser refresh button is clicked...");
        }
    }
    else
    {
        alert('clicked')
        if(event.currentTarget.performance.navigation.type == 1)
        {
            alert("Browser refresh button is clicked...");
        }
        if(event.currentTarget.performance.navigation.type == 2)
        {
            alert("Browser back button is clicked...");
        }
    }
}
window.onbeforeunload = HandleBackFunctionality;
$(document).unload(HandleBackFunctionality);

以及它不适合我:(

好吧@kapa说这是一个重复的问题,我已经提到过为此搜索了很多并且已经看到了很多这个问题的解决方案.

我的问题不是解决问题的方法,而是可用的最佳解决方案

我们正在编写一个Web应用程序作为后端的控制面板,我们只使用JavaScript - 所有DOM元素都是动态创建的,根本没有静态HTML.

我们有一个模块/插件类型接口,模块是"视图"的集合 - 视图本质上是一个函数,它包含一个初始化方法,它接受一个div的arg,因此它知道在哪里绘制自己.

当用户在视图之间浏览时,我们会保留他们去过的地方和他们所在的历史等等.因此我们可以在视图之间提供后退/前进导航,以及在导航时保存视图的状态.

我们提供面包屑跟踪以及后退和前进按钮.我还想做的是挂钩浏览器后退/前进按钮,这样我们就可以拦截点击并覆盖它,以便浏览我们正在维护的历史记录 - 当它们到达我们维护的历史记录的第一页时我们当然不会覆盖并让他们离开我们的网站.

有一个共同的方法来做到这一点？或者浏览器明确地阻止了这种事情？

谢谢

我必须维护一个带有 AJAX 搜索表单的站点（例如书籍），并且我希望搜索结果成为浏览器历史记录的一部分。

所以我设置了“popstate”事件处理程序

window.addEventListener('popstate', function(e) {
    alert("popstate: " + JSON.stringify(e.state));
});

并在成功的 AJAX 请求后调用pushState()：

var stateObj = { q: "harry potter" };
window.history.pushState(stateObj, "Result", "/search");

然后我的点击流是：

1. 使用搜索表单加载页面 - 正常请求 - 路径为 /
2. 输入查询字符串并提交表单 - AJAX 请求 - 路径更改为/search
3. 单击搜索结果 - 正常请求 - 路径更改为/books/harry-potter

4. 当我走了回去通过点击浏览器的后退按钮，我会希望与根据状态对象触发了“popstate”事件。但什么也没有发生。-路径更改为 /search

5. 当我再回去一次时，我收到一条警告，其中popstate: null -路径更改为 /

6. 当我在那之后继续前进时，我得到popstate: {"q":"harry potter"} -路径更改为 /search

因此，重要的 popstate 事件（带有查询字符串的事件）仅在前进时触发，而在返回时不会触发。

这是因为我从一个站点导航回来，它的历史条目是自动创建的，而不是由 pushState 以编程方式创建的？但如果是这样，History API …

需要创建javascript确认弹出点击浏览器后退按钮.如果我点击后退按钮,弹出窗口会出现并说"你想要继续？" 如果单击是,则它将重定向到上一页.

我有以下代码,它不符合要求.

if(window.history && history.pushState){ // check for history api support
        window.addEventListener('load', function(){

            // create history states
            history.pushState(-1, null); // back state
            history.pushState(0, null); // main state
            history.pushState(1, null); // forward state
            history.go(-1); // start in main state

            this.addEventListener('popstate', function(event, state){
                // check history state and fire custom events
                if(state = event.state){

                    event = document.createEvent('Event');
                    event.initEvent(state > 0 ? 'next' : 'previous', true, true);
                    this.dispatchEvent(event);

                    var r = confirm("Would you like to save this draft?");
                    if(r==true) { 
                        // Do …