Question

我的通知的ajax代码设置了间隔。代码正在运行，但是当重新加载页面时，整个ajax函数也会重新加载。

这种情况正在发生，因为我的jsp包含在其他jsp的

中

<%@include file="../levelOfAccess.jsp"%>

我想发生什么：

我希望ajax函数在程序启动后保持静态    - 直到它结束

这是因为我有这个代码，当用户点击通知时，数字不会停留（它正在工作）但是一旦重新加载页面，并且因为ajax将重新加载它，数字再次显示（它应该只显示以前数据的长度是否更长。

点击后，我清空div。

 $("#value").empty();

有一种简单的方法吗？

var recent = 0;
setInterval(ajaxCall, 1000);
document.getElementById('yearImport').setAttribute('value', new Date().getFullYear());
var year = document.getElementById('yearImport').value;

function ajaxCall() {
    var position = document.getElementById('position').value;
    $.ajax({
        url: "NotificationsPusher",
        type: 'POST',
        dataType: "json",
        data: {
            year: year,
            position: position

        },
        success: function(data) {

            if (recent < data.length) {
                $("#value").empty();
                $("#value").append(data.length - recent);
            }
            recent = data.length;
            $("#myDropdown").empty();
            if (data.length === 0) {
                $("#value").empty();
                $("#value").append("");
                $("#myDropdown").append('\


            <li class="padding2" style="text-align:center;">No Notifications</li>');
            }
            for (var i = 0; i < data.length; i++) {
                if (i != 0)
                    $("#myDropdown").append('<hr/>');
                if (data[i].status === "Approved") {
                    $("#myDropdown").append('<li class="padding2"><a class="approved" style="text-decoration:none;">' +
                        data[i].task + '</a><br/><h6 class="p">Recently Approved By ' + data[i].name + '<br/>' + data[i].time + '</h6></li>');

                }
                if (data[i].status === "Rejected") {
                    $("#myDropdown").append('<li class="padding2"><a class="rejected" style="text-decoration:none;">' +
                        data[i].task + '</a><br/><h6 class="p">Recently Rejected By ' + data[i].name + '<br/>' + data[i].time + '</h6></li>');

                }

            }



        },
        error: function(XMLHttpRequest, textStatus, exception) {
            alert(XMLHttpRequest.responseText);
        }
    });
}

虽然我的<%@include file="../levelOfAccess.jsp"%>我有这种代码

<%@include file= "/WEB-INF/JSPImports/importsHead.jsp" %><% } else if (position.equalsIgnoreCase("Project Development Officer IV")) {
   %>

进一步解释：例如：

用户登录时


第一个通知是8（Ok）然后

用户点击通知（ok）

通知$("#value").empty();将为空..（仍然可以）然后用户转到另一页。

通知返回到8（ajax应该是静态的）通知应该只显示

如果

例如，通知的长度比前一个长   从数据库中提取的数据变为9 ..

THEN

通知会显示1（上一个 - 当前）

代码为@iceman建议。

点击后我有一个函数会运行这组代码

 function myFunction() {
     var int = 0;
     if (localStorage.getItem("seenNotifications")) {
         int = localStorage.getItem("seenNotifications");
     }
     var tmp = int + parseInt($("#value"));
     localStorage.setItem("seenNotifications", tmp);
     $("#value").empty();
     document.getElementById("myDropdown").classList.toggle("show");
 }

然后在我的ajax里面

success: function(data) {
        var int = 0;

        if (localStorage.getItem("seenNotifications")) {
            int = localStorage.getItem("seenNotifications");
        }

        $("#value").append(data.length - int);

Answer 1

因此，我们所做的将是在浏览器的会话中，我们会跟踪所看到的最新通知数量。因此，如果我在第1页中读取了8通知，则会保存，在第2页，您将检索8并从服务器的长度减去它。

在$("#value").empty();：

之前添加此代码

var intit = 0;
if(localStorage.getItem("seenNotifications")){
    init = localStorage.getItem("seenNotifications");
}
var tmp = init + parseInt($("#value").html())
localStorage.setItem("seenNotifications", tmp);
$("#value").empty();

当您进入显示通知的页面时：

var intit = 0;
if(localStorage.getItem("seenNotifications")){
    init = localStorage.getItem("seenNotifications");
}
$("#value").html(data.length - init);

如果您希望在多个系统中保留此功能，那么您应该将此存储从本地更改为服务器，即。只需对服务器执行ajax即可存储服务器中每个用户读取的通知数。

整个Web应用程序运行持续时间的静态ajax？

1 个答案: