Question

我有一个简单的问题，我有一个包含所有相同类名的列表，当点击一个时，它会从容器中激活出来然后重定向你等。当我隐藏它们时它还有一个隐藏按钮所有，我想让浏览器在手动隐藏时提醒我，但是，因为列表已经隐藏在页面上，直到单击按钮显示列表，我不确定这是否与我的jquery有关或不。

Html基本上就是这样 -

<ul class="alertContainer"> <!-- Hidden until button is clicked to show -->
  <li class="alert"> </li>  <!-- each are removed one at a time -->
  <li class="alert"> </li>
  <li class="alert"> </li>
  <li class="alert"> </li>
<ul>

jquery -

 $(document).ready(function() {
 if (!$('.alerts:visible').length === 0)
  alert('all are hidden');

 });

由于在网站加载时已经隐藏了警报，我认为这会导致问题，但是当点击按钮时它们会变得可见，然后可以将它们分别置于隐藏状态。我不确定是否最好将此代码块放在用于删除警报的代码中

jquery单独删除警报 -

 $(document).ready(function() {
$('.alerts').click(function() {
     $(this).animate({ marginLeft: "100%"} , 100);
     $(this).attr("style","overflow-x:visible");

});
});

$(document).ready(function() {
  $('.alerts').click(function() {
     $(this).fadeOut(200);
  });
  });

如果有人能帮助我，我们将不胜感激。

Answer 1

看看下面的代码，尝试用它替换上面列出的所有javascript。

请注意严格使用嵌套，使用回调和链接。

$(document).ready(function() {

    $('.alert').click(function(event) {
        $(this).animate({
            marginLeft: "100%"
        }, 100, function() {
            $(this).attr("style","overflow-x:visible");
        }).fadeOut(200, function() {
            if ($(".alertContainer li:visible").length == 0) {
                alert('all are hidden');
            }
        });

    });

});

检查具有相同类的所有元素是否隐藏

1 个答案: