Question

我有一个基于AJAX的网格控件。

我们挂钩window.onbeforeunload事件以检查他们是否有未保存的数据，如果是这样，则会显示一条消息“你确定要导航......你有未保存的数据......”。

这一切都很好。

但是AJAX调用也会触发window.onbeforeunload，因此如果网格有未保存的数据并且我们进行了AJAX调用（例如删除另一个网格中的行），则用户会收到“你确定要离开吗？” ..你有未保存的数据......“信息不好。

是否可以抑制AJAX调用的onbeforeunload事件？或者是否可以检测到呼叫是 AJAX呼叫？否则我们必须得到黑客攻击！

由于

Answer 1

如果您想通过超链接触发回发，则有一个简单的解决方法：而不是

<a href="javascript:submitFunction();">Submit</a>

或

<a href="javascript:;" onclick="submitFunction();">Submit</a>

只需使用此代码：

<a href="#" onclick="submitFunction();">Submit</a>

如果超链接的href属性的内容不是当前页面（锐利字符指示），IE似乎会触发onbeforeunload事件。

Answer 2

我做了类似的事情：

体内标签：

  var allowConfirm = true;

  window.onbeforeunload = confirmExit;
  function confirmExit()
  {
    if(allowConfirm)
        return "Are you sure you want to navigate away from this page?";
    else
        allowConfirm = true;
  }

当我退出时，我称之为脚本：

allowConfirm = false; return window.location.href;

Answer 3

这真的很奇怪，你确定你的Ajax调用没有加载新链接吗？

请务必阅读此相关规范：onbeforeunload spec

查看Ajax调用是否可能触发调用表中列出的任何操作。

Answer 4

在IE6或href的情况下，您可以挂钩回发功能。即：如果回发函数是WebForm_DoPostBackWithOptions并使用Jquery，请将以下代码添加到上面的代码中

var DoPostBackWithOptionsHook = null;

$(document).ready(function(){
  DoPostBackWithOptionsHook = WebForm_DoPostBackWithOptions;
  WebForm_DoPostBackWithOptions = WebForm_DoPostBackWithOptionsHook;
}

function WebForm_DoPostBackWithOptionsHook(options) {
    var navigateAwayFlag = $("input[id*='navigateAwayValue']");
       if (navigateAwayFlag.length > 0) {
           navigateAwayFlag[0].value = "false"; }

    return DoPostBackWithOptionsHook(options)
}

Answer 5

如果您正在谈论ASP.NET AJAX部分回发，那么我今天也遇到了这种行为，做了完全相同的事情。（如果你不是，请完全忽略我的帖子。）

根据我的经验，似乎你的部分回发是由输入触发的，它不会在部分回发期间触发onbeforeunload，但如果部分回发是由 超链接 触发的，它会。如果你点击一个锚标签中的任何东西（仅在IE和FireFox中测试，但是是的），浏览器似乎假设你正在导航。

页面是否具有某个隐藏字段已经是我用来确定客户端时适合显示导航警告的内容，因此我能够通过添加对隐藏的检查来解决这个问题。字段的值是我的onbeforeunload的if条件，并挂钩到PageRequestManager的BeginRequest和EndRequest处理程序来设置值。这有效地在部分回发期间禁用警告。如果您想要检查更具体的内容，可以在此处添加更复杂的逻辑。

这是一个非常简化的代码示例。（对不起，如果我削减和审查到它不起作用但它应该给你一个想法。）

window.onbeforeunload = checkNavigateAway;

Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(onBeginRequest);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(onEndRequest);

function onBeginRequest(sender, args) {
    var navigateAwayFlag = $("input[id*='navigateAwayValue']");
    if (navigateAwayFlag.length > 0) {
        navigateAwayFlag[0].value = "false";
    }
}

function onEndRequest(sender, args) {
    var navigateAwayFlag = $("input[id*='navigateAwayValue']");
    if (navigateAwayFlag.length > 0) {
        navigateAwayFlag[0].value = "true";
    }
}

function checkNavigateAway() {
    var navigateAwayFlag = $("input[id*='navigateAwayValue']");
    if (navigateAwayFlag.length > 0 && navigateAwayFlag[0].value == "true")
    {
        return "Warning Text";
    }
}

修改：坏消息。以上似乎在IE6中不起作用。它似乎以与Firefox不同的顺序触发事件，因此onbeforeunload在AJAX beginRequest之前触发...可能必须找到一种方法来通过超链接点击在onbeforeunload触发之前更改标志的值。

Answer 6

这实际上有效：

 OnClientClick="eval(this.href);return false"

Answer 7

此问题的一个解决方法是使用jquery在超链接标记的click事件上调用submitFunction（），并从超链接中删除href属性。

Answer 8

这是不可能的，没有办法确定是否按下了浏览器的刷新按钮。

Answer 9

不使用AJAX，但仍希望防止页面保留未保存的更改。我尝试了大多数先前的建议，包括navigateAway。它们都不适用于IE 8. NavigateAway始终返回长度为0.

我确实找到了一个关于在标签中使用class作为ID然后根据它设置布尔值的解决方案的博客。我试过了，但它不起作用，因为.NET在输出HTML时将输入标记包装在一个带有在其中声明的类的span标记中。我的最终解决方案是在标签的ID名称中加入Ignore一词。另外，为了防止在设置布尔值的代码捕获click之前调用onbeforeunload，必须使用，例如asp：Button或asp：Input。最后，asp force（VS IDE）将起始名称作为控件的类型; ID =＆＃34; Button_Save＆＃34 ;.使用asp：标签还可以防止onbeforeunload被调用两次。

<script type="text/javascript" language="javascript">
 var stuffchanged = false
 var ignorenavigate = false

  $(document).ready(function () {


    //Detect whether the event source has "nonavigate" class specified
    $("a,input,img,checkbox,button").click(function () {
        var str = $(this).attr("ID");
        ignorenavigate = str.search("Ignore") > 0;
    });

});

window.onbeforeunload = confirmExit;
function confirmExit() {
    if (stuffchanged && !ignorenavigate) {
        return "You have attempted to leave this page with unsaved changes.  If you have made any changes to the fields without " +
    "clicking the Save button, your changes will be lost.  Are you sure you want to exit this page?";
    }  

}

  function textchanged() {
     stuffchanged = true;
  }

我可以阻止在执行AJAX调用时调用window.onbeforeunload

9 个答案: