显示javascript警报而不阻止javascript

时间:2014-05-08 14:12:13

标签: javascript jquery html asp.net asp.net-mvc

在页面加载时,我正在启动计时器以检查会话是否已过期。我通过对页面进行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分钟后显示,但如果用户未单击“确定”,则会阻止javascript并且不再进行任何ajax调用。

有没有办法可以在不阻止警报的情况下显示警报? 我不想使用jQuery对话框。

2 个答案:

答案 0 :(得分:5)

不,没有停止执行脚本就无法显示本机警报。

唯一的方法是使用对话框或非本机警报的东西

http://jqueryui.com/dialog/

答案 1 :(得分:0)

感谢adeneo !! 我想让页面保持清晰,所以我最终得到了自定义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';
}