显示javascript警报没有阻止javascript

Show javascript Alert without blocking javascript

本文关键字:javascript 显示      更新时间:2023-09-26

在页面加载时,我启动一个计时器来检查会话是否过期。我正在检查到期,使ajax调用到一个页面。我需要在到期前5分钟显示警报,并在到期后重定向到默认页面。下面是我的代码:

function startSessionCheckTimer() {
    setInterval(checkSessionExpiry, 60000);
}
function checkSessionExpiry() {
    $.ajax({
        type: "POST",
        url: "/Default.aspx/IsSessionOpen",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (time) {
            if (time.d == 5) {
                //alert("Your session will expire in 5 minutes.");
                setTimeout(function () { alert('Your session will expire in 5 minutes.'); }, 100);
            }
            else if (time.d <= 0) {
                window.location = "/Default.aspx";
            }
        }
    });
}

警告在5分钟后显示,但如果用户没有单击OK,它会阻止javascript并且不会进行进一步的ajax调用。

是否有一种方法,我可以显示警报而不阻止它?我不想使用jQuery对话框

不,在不停止脚本执行的情况下,没有办法显示本地警报。

唯一的方法是使用对话框或其他不是本地警报的东西

http://jqueryui.com/dialog/

谢谢!我想保持页面的轻,所以我结束了我的自定义HTML弹出。

下面是我用于自定义html弹出窗口的代码,可能对某些人有用:

CSS:

.disablepagediv {
    z-index: 1001;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: none;
    position: absolute;             
    background-color: rgba(0,0,0,0.5);
    color: #aaaaaa;
}
.masterpopup {
    width: 270px;
    height: 100px;
    position: absolute;
    color: #000000;
    background-color: #ffffff;
    /* To align popup window at the center of screen*/
    top: 200px;
    left: 50%;
    margin-top: -100px;
    margin-left: -150px;
    border: 1px solid rgb(124, 153, 193);
}
HTML:

<div id="popDiv" class="disablepagediv">
    <div class="masterpopup">
        <div style="height:25px;line-height:25px;background-color:rgb(6, 62, 137);color:white;padding-left:5px;">
            Warning
        </div>
        <div align="center" style="padding-top:5px">
            Your session will expire in <label id="lblSessionExpiryMins"></label> minutes.
            <br/>
            <input type="button" style="margin:5px" onClick="hide('popDiv')" value="Close" />
        </div>
    </div>
</div>
JavaScript:

function startSessionCheckTimer() {
    setInterval(checkSessionExpiry, 60000);
}
function checkSessionExpiry() {
    $.ajax({
        type: "POST",
        url: "/Default.aspx/IsSessionOpen",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (time) {
            if (time.d <= 0) {
                window.location = "/Default.aspx";
            }
            else if (time.d <= 5) {
                document.getElementById('lblSessionExpiryMins').innerHTML = time.d;
                if (time.d == 5 || time.d == 1) {
                    pop('popDiv');
                }
            }
        }
    });
}
$(document).ready(function () {
    startSessionCheckTimer();
});
function pop(div) {
    document.getElementById(div).style.display = 'block';
}
function hide(div) {
    document.getElementById(div).style.display = 'none';
}