Question

我有一个PHP通知系统，使用jQuery将通知量放入DIV。唯一的问题是，当有0个通知时，空的DIV仍会显示。这是我目前使用的jQuery：

$(document).ready(function() {
    $.get('/codes/php/nf.php', function(a) {
        $('#nfbadge').html(a);
        $('#nfbadge:empty').remove();
    })
});
setInterval(function() {
    $.get('http://localhost/codes/php/nf.php', function(a) {
        $('#nfbadge').html(a);
        $('#nfbadge:empty').remove();
    })
}, 8000);

唯一的问题是，如果在文档加载时有0个通知并且添加了通知，则徽章将不会显示，因此基本上如果删除该元素，除非重新加载页面，否则它将不会返回，但是制作了通知系统，以便不必重新加载页面。我该如何解决这个问题？

Answer 1

.remove（）从元素中取出元素以及内容。这就是为什么除非你重装，否则它不会回来。使用.fadeOut（）或.hide（）代替

Answer 2

您应该做更多这样的事情：

var elm = $('#nfbadge'),
      T = setInterval(getCodes, 8000);

function getCodes() {
    $.get('/codes/php/nf.php', function(a) {
        elm.html(a);
        if (elm.is(':empty') && elm.is(':visible')) {
            elm.hide();
        }else{
            elm.show();
        }
   });
}

您需要做更多的工作，但应该让您走上正确的轨道！

Answer 3

为什么不把div隐藏起来？

http://www.randomsnippets.com/2008/02/12/how-to-hide-and-show-your-div/

Answer 4

如果您可以控制PHP，则不应该使用jQuery删除DIV，这会浪费资源和加载时间，即使它只是几行代码。

在PHP模板中，您应该在条件语句中包含#nfbadge div，例如：

if($notifications) {
     echo '<div id="nfbadge">';
     //notification stuff
     echo '</div>';
}

然后使用您的jQuery代码，您可以执行以下操作：

 var $nfbadge = $('#nfbadge');
 if($nfbadge) {$nfbadge.html(a)}

仅在空时删除DIV

4 个答案: