Question

已实施此code，以便向访问者显示通知。

我的控制器

     public ActionResult Index()
    {
        var notification = (from r in db.Notification
                            select r);

        ViewBag.NotifyTotal = notification.Count();

        return View(db.Notification.ToList());
    }

我的观点

<a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <div id="noti_Counter"></div>
                                <div id="noti_Button"></div>
                            </a>

我的jquery

 <script>
$(document).ready(function () {

    $('#noti_Counter')
        .css({ opacity: 0 })
        .text('@ViewBag.NotifyTotal')            
        .css({ top: '-10px' })
        .animate({ top: '-2px', opacity: 1 }, 500);

    $('#noti_Button').click(function () {


        $('#notifications').fadeToggle('fast', 'linear', function () {
            if ($('#notifications').is(':hidden')) {
                $('#noti_Button').css('background-color', '#2E467C');
            }
            else $('#noti_Button').css('background-color', '#FFF');


        });

        $('#noti_Counter').fadeOut('slow');    


        return false;
    });


    $(document).click(function () {
        $('#notifications').hide();


        if ($('#noti_Counter').is(':hidden')) {


            $('#noti_Button').css('background-color', '#2E467C');

        }
    });

    $('#notifications').click(function () {

        return false;     
    });



});
</script>

如果用户已经在noti_button点击了一次，我需要将noti_Counter隐藏在刷新页面上。

我是否必须通过jquery执行此操作，还是可以使用标志将其检查到控制器，以便知道用户是否已单击通知并将计数器设为= 0？

谢谢

Answer 1

使用localStorage。

$('#noti_Button').click(function () {
    localStorage.setItem('hasViewed',"yes");
    //Other code
});

然后在document.ready中将其视为：

$(document).ready(function () {
   var isViewed=localStorage.setItem('hasViewed');
   if(isViewed==="yes")
      $('#noti_Counter').hide();  //hope this line hides notification 
   //remaining code
});

如果出现新通知，您还需要注意。 localStorage在这种情况下不是一个好选择，我会根据某些条件使用 server side razor generating syntax 。

您可以做的是，在notification table添加额外的行isSeen。用户点击notification后，发送一个ajax请求，并将每行的isSeen值设为true，然后在您的代码中获取notification，只获取那些记录。 isSeen是false。然后根据count的{{1}}，notification或hide使用剃刀语法中的show。这有助于您在每次刷新页面时仅提取notification通知。

如果已经点击了Jquery - MVC，请保持div隐藏

1 个答案: