因為 jQuery 本身有鏈結(chain)的功能,所以在使用的過程中就能一直點下去。不過若某些動作是需要滿足某些條件時的話,這時通常就得透過條件判斷來處理了。但也因為這樣就不得不分成幾段程式囉。而 IF plugin for jQuery 的出現就是讓咱們在寫的過程中也能直接做條件判斷哩。
套件名稱:IF plugin for jQuery
套件網址:1.0.2
作者網站:http://code.google.com/p/jquery-if/
套件網址:N/A
發佈日期:2011-03-11
檔案大小:7.00 KB
檔案下載:jquery.if.js
參數選項說明:
檢視原始碼 JavaScript
1 2 3 | expr(必填) 描述: 條件判斷表示式, 結果要能判斷 true 或 false 的 預設值: 無 |
方法說明:
檢視原始碼 JavaScript
1 2 3 4 5 6 7 8 | // IF() 條件判斷, 如果條件成立會執行後面的動作到 ELSE() 或是 ENDIF() $(selector).IF(expr); // ELSE() 條件判斷, 如果條件成立會執行後面的動作到下一個 ELSE() 或是 ENDIF() $(selector).ELSE(expr); // 結束條件判斷 $(selector).ENDIF(); |
使用範例:
檢視原始碼 JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 | <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.if.js"></script> <style type="text/css"> #myElement { width: 200px; height: 100px; border: 1px solid #ddd; text-align: center; line-height: 100px; display: none; } </style> <script type="text/javascript"> $(function(){ // 預設 myVar 為 'maybe' var myVar = 'maybe'; // 先在 #myElement 顯示 myVar 的值 // 接著判斷如果 myVar 為 'yes', 'maybe' 及非以上二者時的動作 $('#myElement').html('現在 myVar 的值是 ' + myVar) .IF(myVar == 'yes') .css('color', 'green') .click(function(){ alert('Yes'); }) .ELSE(myVar == 'maybe') .css('color', 'blue') .click(function(){ alert('Maybe'); }) .ELSE() .css('color', 'red') .click(function(){ alert('No'); }) .ENDIF() .show(); }); </script> <body> <div id="myElement"></div> </body> |