jQuery fadeOut 異步實例代碼詳解

更新時間：2016年08月18日 10:52:25 作者：fangfan

fadeOut() 方法逐漸改變被選元素的不透明度，從可見到隱藏（褪色效果）。這篇文章給大家介紹jquery fadeout異步實例代碼，感興趣的朋友一起看下吧

定義和用法

fadeOut() 方法逐漸改變被選元素的不透明度，從可見到隱藏（褪色效果）。

注釋：隱藏的元素不會被完全顯示（不再影響頁面的布局）。

提示：該方法通常與 fadeIn() 方法一起使用。

語法

$(selector).fadeOut(speed,easing,callback)

1. 概述

jquery實現(xiàn)動畫效果的函數(shù)使用起來很方便，不過動畫執(zhí)行是異步的，所以要把自定義的操作放在回調(diào)函數(shù)里。

2. example

<html>
<body>
<table id="test-table">
<tbody>
<tr>
<td>zhangsan</td>
<td>23</td>
<td>hunan</td></tr>
<tr>
<td>zhangsan2</td>
<td>233</td>
<td>hunan2</td></tr>
<tr>
<td>zhangsan3</td>
<td>234</td>
<td>hunan4</td></tr>
<tr>
<td>zhangsan5</td>
<td>235</td>
<td>hunan5</td></tr>
</tbody>
</table>
<script src="jquery-3.1.0.js"></script>
<script type="text/javascript">
$(function(){
'use strict';
(function(){
var tr = $("#test-table>tbody>tr:visible").first();
tr.fadeOut('4000', function(){ $(this).remove()});
})();
});
</script>
</body>
</html>

3. something

上面的例子，回調(diào)函數(shù)可以用箭頭函數(shù)替代，

<script type="text/javascript">
$(function(){
'use strict';
(function(){
var tr = $("#test-table>tbody>tr:visible").first();
tr.fadeOut('4000', ()=>tr.remove());
})();
});
</script>

以上所述是小編給大家介紹的jQuery fadeOut 異步實例代碼詳解，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

您可能感興趣的文章: