1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"> 6 </script> 7 <script> 8 $(document).ready(function(){ 9 $("button").click(function(){ 10 $("p").hide("slow",function(){ 11 alert("段落现在被隐藏了"); 12 }); 13 }); 14 }); 15 </script> 16 </head> 17 <body> 18 <button>隐藏</button> 19 <p>我们段落内容，点击“隐藏”按钮我就会消失</p> 20 </body> 21 </html>
对比没有callback的效果：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"> 6 </script> 7 <script> 8 $(document).ready(function(){ 9 $("button").click(function(){ 10 $("p").hide(1000); 11 alert("现在段落被隐藏了"); 12 }); 13 }); 14 </script> 15 </head> 16 <body> 17 <button>隐藏</button> 18 <p>这是一个段落，内容很少</p> 19 </body> 20 </html>