弹出模态不等到单击任何按钮 [英] Modal pop up not waiting until any button is clicked

问题描述

大家好，



我在onBeforeunload事件页面上调用了一个函数。在该功能中，我显示模式弹出窗口，其中包含消息和是/否按钮。点击任何按钮，它将给出ajax调用并执行一些操作。但目前我面临的一个问题是，在用户点击按钮之前，此弹出窗口不会等待。它正在进行页面的onunload事件。

请建议在这种情况下可以做什么。

下面是代码。



onbeforeunload =PromptForUnlock（）

  function  PromptForUnlock（e）{
 ExtenderControls.ModalPopup.showModalPopup（
 ExtenderControls.ModalTypeEnum.YesNo，
  360 ， 110 ， true ， false ，
 Resources.Information，' < span style = \font-size：15px; color：＃003366; font-权重：粗体; \>' + Resources.AppKeepLo​​ck + ' < / span>' ，
 '  checkApplicationUnlock（）'）; 
  //   var result = window.showModalDialog（'application_diag_unlock.aspx'，Arguments，sFeatures）;  
  return   false ; 
} 
 
  function  checkApplicationUnlock（）{
  var  ret = ExtenderControls.ModalPopup.modalPopupResult（）; 
  var  userID =  ; 
  if （ret == ExtenderControls.ModalPopupResultEnum.No）{
 ExtenderControls.ModalPopup.hideModalPopup（）; 
  var  param = '  {UserID ：' + userID + ' }'; 
 ExtenderControls.ModalPopup.showModalPopup（
 ExtenderControls.ModalTypeEnum.Information，
  360 ， 110 ， false ， true ，Resources.Loading，
 ' < span style = \font-size：15px; color：＃003366; font-weight：bold; \> ;' + Resources.Loading + ' < / span>'，空）; 
 $ .ajax（{
 type：'  POST'，
 url：'  PageMethods.aspx / SetApplicationLock'，
 data：param，
 contentType：'  application / json; charset = utf-8'，
成功：< span class =code-keyword> function （）{
 CallBack =  true ; 
}，
 error ： function （）{
}，
  //  将async设置为false将使服务器方法同步调用，浏览器将在调用期间被阻止 
 async： false  
}）; 
 StartTimer（）; 
} 
  else  {
 ExtenderControls.ModalPopup.hideModalPopup（）; 
} 
 CheckForChangesToApplication（Resources.SavePrompt）; 
} 
 
  function  StartTimer（）{
  if （CallBack || TimeElapsed> = Timeout）{
 ExtenderControls.ModalPopup.hideModalPopup（）; 
} 
  else  {
  window  .setTimeout（  StartTimer（）， 1000 ）; 
 TimeElapsed ++; 
} 
} 

解决方案

.ajax（{
type：' POST'，
url：' PageMethods.aspx / SetApplicationLock'，
data：param，
contentType：' application / json; charset = utf-8'，
成功： function （）{
CallBack = true ;
}，
错误： function （）{
}，
// 将async设置为false将使服务器方法同步调用，浏览器将是在通话期间被阻止
async： false
}）;
StartTimer（）;
}
else {
ExtenderControls.ModalPopup.hideModalPopup（）;
}
CheckForChangesToApplication（Resources.SavePrompt）;
}

function StartTimer（）{
if （CallBack || TimeElapsed> = Timeout）{
ExtenderControls.ModalPopup.hideModalPopup（）;
}
else {
window .setTimeout（ StartTimer（）， 1000 ）;
TimeElapsed ++;
}
}

beforeunload | onbeforeunload事件 [ ^ $

当一个字符串被分配给window.event的returnValue属性时，会出现一个对话框，让用户可以选择保留当前文档...

WindowEventHandlers.onbeforeunload [ ^ ]

函数应该为Event对象的returnValue属性赋值并返回相同的字符串。

...

自2011年5月25日起，HTML5规范声明调用 window.showModalDialog（）， window.alert（），window.confirm（）和 window.prompt（）此活动期间可能会忽略>方法。

你不能在<$ c $中做任何聪明的事情c> onbeforeunload 事件，因为这会为恶意页面提供一种阻止你离开页面的方法。



所有你能做的就是返回一条消息，该消息将显示给用户。用户可以选择取消导航并停留在页面上，或继续导航离开页面。



http://www.zachleat.com/web/dont-let-the-door-hit-you-onunload -and-onbeforeunload / [ ^ ]

http：//www.hunlock。 com / blogs / Mastering_The_Back_Button_With_Javascript [ ^ ]

Hi All,

I am calling one function on onBeforeunload event of page. In that function I am showing modal pop up which having message and Yes/No button. on click of any button it will give ajax call and perform some operation. But currently I am facing one issue that this popup is not waiting until the user click on the button. It is proceeding with onunload event of the page.
Please suggest what can be done in this case.
Below is the code.

onbeforeunload="PromptForUnlock()"

function PromptForUnlock(e) {
    ExtenderControls.ModalPopup.showModalPopup(
            ExtenderControls.ModalTypeEnum.YesNo,
            360, 110, true, false,
            Resources.Information, '<span style=\"font-size:15px;color:#003366;font-weight:bold;\">' + Resources.AppKeepLock + '</span>',
            'checkApplicationUnlock()');
    // var result = window.showModalDialog('application_diag_unlock.aspx', Arguments, sFeatures);
return false;
   }

function checkApplicationUnlock() {
    var ret = ExtenderControls.ModalPopup.modalPopupResult();
    var userID = "";
    if (ret == ExtenderControls.ModalPopupResultEnum.No) {
        ExtenderControls.ModalPopup.hideModalPopup();
        var param = '{"UserID":"' + userID + '"}';
        ExtenderControls.ModalPopup.showModalPopup(
            ExtenderControls.ModalTypeEnum.Information,
            360, 110, false, true, Resources.Loading,
            '<span style=\"font-size:15px;color:#003366;font-weight:bold;\">' + Resources.Loading + '</span>', null);
        $.ajax({
            type: 'POST',
            url: 'PageMethods.aspx/SetApplicationLock',
            data: param,
            contentType: 'application/json; charset=utf-8',
            success: function () {
                CallBack = true;
            },
            error: function () {
            },
            //set async to false will make the server method call synchronously, the browser will be blocked during the call
            async: false
        });
        StartTimer();
    }
    else {
        ExtenderControls.ModalPopup.hideModalPopup();
    }
    CheckForChangesToApplication(Resources.SavePrompt);
}

function StartTimer() {
    if (CallBack || TimeElapsed >= Timeout) {
        ExtenderControls.ModalPopup.hideModalPopup();
    }
    else {
        window.setTimeout("StartTimer()", 1000);
        TimeElapsed++;
    }
}

解决方案

.ajax({ type: 'POST', url: 'PageMethods.aspx/SetApplicationLock', data: param, contentType: 'application/json; charset=utf-8', success: function () { CallBack = true; }, error: function () { }, //set async to false will make the server method call synchronously, the browser will be blocked during the call async: false }); StartTimer(); } else { ExtenderControls.ModalPopup.hideModalPopup(); } CheckForChangesToApplication(Resources.SavePrompt); } function StartTimer() { if (CallBack || TimeElapsed >= Timeout) { ExtenderControls.ModalPopup.hideModalPopup(); } else { window.setTimeout("StartTimer()", 1000); TimeElapsed++; } }

beforeunload | onbeforeunload event[^]

When a string is assigned to the returnValue property of window.event, a dialog box appears that gives users the option to stay on the current document ...

WindowEventHandlers.onbeforeunload[^]

The function should assign a string value to the returnValue property of the Event object and return the same string.
...
Since 25 May 2011, the HTML5 specification states that calls to window.showModalDialog(), window.alert(), window.confirm(), and window.prompt() methods may be ignored during this event.

You can't do anything clever in the onbeforeunload event, since that would provide a way for malicious pages to prevent you from leaving the page.

All you can do is return a message, which will be displayed to the user. The user can chose to cancel the navigation and stay on the page, or continue navigating away from the page.

http://www.zachleat.com/web/dont-let-the-door-hit-you-onunload-and-onbeforeunload/[^]
http://www.hunlock.com/blogs/Mastering_The_Back_Button_With_Javascript[^]

这篇关于弹出模态不等到单击任何按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！