WEB 教程
实践 示例
HTML 参考手册
CSS 参考手册
PHP 参考手册

如何在 jQuery 中停止触发事件直到效果完成

主题:JavaScript / jQuery上一页|下一页

答案:使用jQuery回调函数

您可以利用jQuery回调函数机制来阻止事件触发,直到效果完全完成,例如在幻灯片动画或淡出过渡完全完成后做一些事情等等。 让我们看一个例子,看看它是如何工作的:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Fire Events after an Effect is Over</title>
<style>
    .box{
        height: 300px;
        display: none;        
        background: yellowgreen;
    }
</style>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
    $(".box").slideDown(3000, function(){
        $(".hint").text("Sliding is completed, now fading out.");
        $(this).fadeOut(3000, function(){
            $(".hint").text("Fading out completed.");
        });
    });
});
</script>
</head>
<body>
    <div class="box"></div>
    <p class="hint"></p>
</body>
</html>

FAQ 相关问题解答

以下是与此主题相关的更多常见问题解答:

Advertisements