使用PHP或Javascript检测页面刷新或新加载

时间:2012-02-21 13:56:22

标签: php javascript google-chrome browser-tab

如何使用PHP或Javascript检测浏览器中的标签关闭。换句话说,如何查找页面是否在新选项卡中刷新或打开。我关注标签,而不是浏览器。

2 个答案:

答案 0 :(得分:1)

您可以拥有window.onbeforeunload事件的监听器。但是,您将无法检测该标签是否已从JavaScript关闭。

答案 1 :(得分:0)

实际上Javascript可以告诉你Tab是否会被关闭。需要使用两种不同的方法(一种用于IE,一种用于其他人)。

我编写了一个Javascript流程来完成您的要求。该过程的先决条件是jQuery和一个插件(livequery - 因为一些HTML是在页面加载后动态生成的)。无论如何,这里是执行所有这些操作的js文件(checkclosing.js):

// Global Var
var bodyclicked = false;
var datachanged = false;
var nodirtycheck = false;

// Start the engines :)
$(document).ready(function () {
    init();
});

function init() {
    bindEvents();
}

function bindEvents() {
    // Bind the onClick event for the DOM body
    $(document).livequery(function () {
        bodyclicked = true;
    });

    // Bind our event handlers for the change and reset events
    $(':input').not('.excludeFromDirtyCheck').bind('change', function () {

        if ($(this).hasClass('dataLoader')) {
            if (!datachanged) {
                return;
            }
        }

        datachanged = true;

        $(".hidDataChanged").val("True");
    });

    $(':reset,:submit').bind('click', function () {
        // .NET renders some ASP Buttons as Submit and Reset types
        if ($(this).hasClass('notSubmit')) {
            return;
        }

        if ($(this).hasClass('notReset')) {
            return;
        }

        datachanged = false;

        $(".hidDataChanged").val("False");
    });

    // Must have the livequery plugin referenced for this to work
    $('.resetchangedform').livequery('click', function (event) {
        //alert("resetchanged"); // FIXME
        datachanged = false;

        // Set our hidden input (on the Administration Master page)
        $(".hidDataChanged").val("False");
    });

    // Must have the livequery plugin referenced for this to work
    $('.setchangedform').livequery('click', function (event) {
        //alert("setchanged"); // FIXME
        datachanged = true;

        // Set our hidden input (on the Administration Master page)
        $(".hidDataChanged").val("True");
    });

    // Must have the livequery plugin referenced for this to work
    $('.excludeFromDirtyCheck').livequery('click', function (event) {
        nodirtycheck = true;

    });

    // Must have the livequery plugin referenced for this to work
    $('.notSubmit').livequery('click', function (event) {
        nodirtycheck = true;
    });

    // Must have the livequery plugin referenced for this to work
    $('.dataReloader').livequery('change', function (event) { 
        nodirtycheck = true;
    });

    window.onbeforeunload = function () {
       //alert("datachanged = " + datachanged + " | nodirtycheck = " + nodirtycheck + " | hidDataChanged = " + $(".hidDataChanged").val());

        // Check the hidden textbox
        if ($(".hidDataChanged").val() == "True") {
            datachanged = true;
        }

        if (nodirtycheck) {
            nodirtycheck = false;
        }
        else {

            if (navigator.appName == "Microsoft Internet Explorer") {
                // IE
                if (bodyclicked) {
                    if (datachanged) {
                        return "You may have unsaved changes...";
                    }
                }
                else {
                    bodyclicked = false;
                    // Do Nothing
                }
            }
            else {
                // Not IE
                if (datachanged) {
                    return "You may have unsaved changes...";
                }
                else {
                    // Do Nothing
                }

            } //if (navigator.appName == "Microsoft Internet Explorer") {

        } //window.onbeforeunload = function () {

    }     // if (nodirtycheck) {

}

然后,只需在要检查关闭选项卡的任何页面上包含对此文件的引用:

这是为了帮助防止用户从未保存更改表单值的页面导航。是的,我知道大多数情况下,阻止用户关闭标签或导航是不好的做法,但在这种情况下 - 用户请求它,这是一个不供公众使用的内部应用程序。

在让用户关闭标签或离开之前,您不希望检查任何更改的控件只会被赋予类名为excludeFromDirtyCheck。

这可能超出您的需要,但您可以剥离无用的部分。基本前提是一样的。