Question

我有一个页面可能有也可能没有提醒：

<div class="alert">Some alert</div>

我在5秒后隐藏它们：

<script type="text/javascript">
$(document).ready(function () {

window.setTimeout(function() {
    $(".alert").fadeTo(1500, 0).slideUp(1500, function(){
        $(this).remove(); 
    });
}, 5000);

});
</script>

所以我想知道，我是否应该将警报隐藏功能放入我的常规功能中，这些功能总是在页面加载时执行，即使没有隐藏警报？或者将它放在实际警报div代码正下方的HTML代码中，以便只有在该警报显示时才会发生？

第一个选项的好处是我的代码更有条理。缺点是即使没有警报也可能会执行。

第二个选项的优点是它只在警报显示时执行，但缺点是代码更乱。

哪个更好？

Answer 1

没有什么不好，但删除setTimeout：

可以提高效率

$(".alert").delay(5000).fadeTo(1500, 0).slideUp(1500, function(){
    $(this).remove(); 
});

这样，没有任何操作，如果没有警报，则不会注册回调。

至于代码的位置，您应该避免将其置于HTML的中间位置。隔行扫描HTML和Javascript主要是阻碍可维护性的不良做法。一个干净的模块化Javascript应该是解决方案。

Answer 2

现在只有在alert存在时才会运行。

if($(".alert").length > 0) {
 $(".alert").fadeTo(1500, 0).slideUp(1500, function(){
        $(this).remove(); 
    });
 }, 5000);
}

在一个并不总是发生的事件上执行jQuery脚本是不是很糟糕？

2 个答案: