jQuery中Callback函数

最新推荐文章于 2022-02-24 11:14:57 发布

原创最新推荐文章于 2022-02-24 11:14:57 发布 · 925 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#callback #jquery #function #generator #button #javascript

jQuery 专栏收录该内容

6 篇文章

订阅专栏

本文介绍如何在JavaScript中利用Callback函数，在当前动画完成后执行特定操作，避免了动画未完成时可能引发的错误或页面冲突。通过实例演示了如何在按钮点击事件中隐藏元素，并在动画结束后显示提示消息。

Callback函数在当前动画100完成之后执行。

因为：由于 JavaScript 语句（指令）是逐一执行的 - 按照次序，动画之后的语句可能会产生错误或页面冲突，因为动画还没有完成。
为了避免这个情况，您可以以参数的形式添加 Callback 函数。

示例：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <script type="text/javascript" src="jquery-1.6.4.js"></script>
  <script type="text/javascript">
	$(document).ready(function(){
		$("button").click(function(){
			$("p").hide(2000,function(){
				alert("The paragraph is now hidden");
			});
		});
	});
  </script>
 </HEAD>

 <BODY>
  <button type="button">Hide</button>
  <p>This is a paragraph with little content.</p>
 </BODY>
</HTML>