每次访问显示一次警报

display alert once per visit

本文关键字:一次 访问 显示      更新时间:2023-09-26

我正在研究如何在用户第一次访问网站时显示一次警报消息。在按下关闭按钮之前,该消息应在每页上都可见。我把代码放在_Layout.cshtml中,但它不起作用。

你能指出我的错误吗?

@if(Session["Alert"] != "Confirmed")
{
    <div id="myAlert" class="alert alert-warning alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
        <strong>Warning!</strong> Better check yourself, you're not looking too good.
    </div>
}
<script type="text/javascript">
$(document).ready(function () {
    $("#myAlert").on('closed.bs.alert', function () {
        sessionStorage.Alert = "Confirmed";
    });
});
</script>

每次重新加载网站/页面时都会显示警报。当按下警报关闭按钮时,脚本看起来好像没有执行。此外,会话["警报"]未设置。

sessionStorage和服务器端Session不是一回事!您不能将值设置为sessionStorage并期望从服务器端Session获得它。所以你有两个选择:

1.使用服务器端Session

更改javascript代码,将ajax请求发送到mvc操作,然后在那里将Session["Alert"]设置为"Confirmed"。

2.使用sessionStorage

不使用@if(Session["Alert"] != "Confirmed"),而是检查文档上的sessionStorage,以决定是否显示警报。

第二个要求更改最小代码。以下代码将起作用:

<div id="myAlert" style="display:none" class="alert alert-warning alert-dismissible" role="alert">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
    </button>
    <strong>Warning!</strong> Better check yourself, you're not looking too good.
</div>
<script type="text/javascript">
    $(document).ready(function () {
        $(document).ready(function () {
            // If not 'Confirmed', show #myAlert
            if (sessionStorage.Alert !== 'Confirmed') {
                $('#myAlert').show();
            }
        });
        $('#myAlert .close').click(function () {
            // Set 'Alert' to 'Confirmed' when user click the close button
            sessionStorage.Alert = "Confirmed";
            $(this).closest('#myAlert').hide();
        });
    });
</script>

在Page_Load子后面的代码中,我设置了会话变量:

    If IsNothing(Session("visit")) Then
        Session("visit") = "no"
    Else
        Session("visit") = "yes"
    End If

在body标签中,我放置了一个onload事件:

onload="showAlert();"

然后我添加了这个小javascript函数:

    function showAlert() {
        var visit = '<%= Session("visit")%>';
        if (visit == 'no') {
            document.getElementById('id01').style.display = 'block';
        }            
    }

当访问者第一次点击我的登录页时,他们会看到我保存在id="id01"的div中的欢迎提醒。下次访问期间,当他们访问登录页时,会话在页面加载时更改为"是",他们不会再看到警报。