Question

如何通过使用Ajax php在我的管理菜单中添加Facebook之类的通知泡泡（通过使用Ajax php）也可以在查看/点击菜单后消失。任何人帮助???

Answer 1

当用户注册时，我猜您是否将他/她添加到您的数据库中？如果是这样，我会在users数据库中添加一个名为＆＃34; notificationViewed＆＃34;的字段，默认情况下，当您将该用户放入数据库时，该字段为false。

当您连接或刷新管理菜单页面时，如果任何用户有一个字段notificationViewed == false，那么为该页面提供服务的php应检查数据库，并COUNT此类返回用户的数量。在代表buble的html标记中，添加属性data-newUsers="<?= COUNT_OF_NEW_USERS ?>"。

现在在客户端......

默认情况下，让我们说id="bubble"隐藏了CSS：

#bubble {
    display:none;
}

使用JavaScript，您可以轻松访问data-*属性：

var newUsers = document.getElementById('bubble').dataset.newUsers; // holds the number

或使用jQuery：

var newUsers = $('#bubble').data('newUsers'); // same thing

此时，您可以查看是否newUsers > 0。如果是这样，请使用数字填充气泡（如果需要），并执行漂亮的fadeIn动画。 jQuery中的示例：

if (newUsers > 0) {
    $('bubble').text(newUsers).fadeIn();
}

现在，我们希望能够检测到点击气泡的时间，以隐藏气泡并丢弃已注册的新用户。再次，使用jQuery：

$('#bubble').click(function() {
    $.post('discardNotifications.php', {usersNotified: newUsers}, function(data) {
        if (data === "ok") { // php script returns this string if all went right
            $('#bubble').fadeOut(function() {
                $('#bubble').remove(); // remove the element from the DOM, to prevent further clicks of the element
            }); // nice fadeOut animation of the bubble      
        }
    }
});

只有POST请求成功，才会调用该函数。 POST请求将定向到discardNotifications.php，该discardNotifications.php必须与admin-menu html文件位于同一目录中（如果不是，只需更改相对路径）。该调用的第二个参数是一个litteral对象，其中包含通知的新用户数，并将其发送到您的后端。

回到后端，在POST ...

内

您必须检查是否有＆＃39; sa users参数名为＆＃34; usersNotified＆＃34;，然后查询您的if (isset($_POST['usersNotified'])) { $number = $_POST['usersNotified']; // update the "notificationViewed" field to TRUE for at most $number different users echo "ok"; // everything went right } else { echo "bad"; }数据库并最多更新＆＃34; usersNotified＆＃34 ;.这考虑到自刷新管理页面以来可能订阅了新用户，并且您希望通知这些新用户。没有选择＆＃34; usersNotified＆＃34;可能会忽略它们。示例（但不完整）：

  var foo = {
    bar: function(){ return this.baz; },
    baz: 1
  }
  console.log(typeof (f = foo.bar)());

您可以进行明显的更改，并且必须实现一些数据库处理。告诉我它是否有效！

Ps：我的代码片段中可能没有什么错误，我没有测试所有内容。

如果使用php ajax添加新用户，管理面板菜单上的通知气泡？

1 个答案: