前段時間釋出了Jquery類庫1.4版本,使用者也越來越多,為了方便大家對Jquery的使用,下面列出了一些Jquery使用技巧。比如有禁止右鍵點選、隱藏搜尋文字框文字、在新視窗中開啟連結、檢測瀏覽器、預載入圖片、頁面樣式切換、所有列等高、動態控制頁面字型大小、獲得滑鼠指標的XY值、驗證元素是否為空、替換元素、延遲載入、驗證元素是否存在於Jquery集合中、使DIV可點選、克隆物件、使元素居中、計算元素個數、使用Google主機上的Jquery類庫、禁用Jquery效果、解決Jquery類庫與其他Javascript類庫衝突問題。
具體如下:
1. 禁止右鍵點選
1.       $(document).ready(function(){   
2.           $(document).bind(“contextmenu”,function(e){   
3.               return false;   
4.           });   
5.       });  

 

2. 隱藏搜尋文字框文字
1.       $(document).ready(function() {   
2.       $(“input.text1”).val(“Enter your search text here”);   
3.          textFill($(`input.text1`));   
4.       });   
5.         
6.           function textFill(input){ //input focus text function   
7.           var originalvalue = input.val();   
8.           input.focus( function(){   
9.               if( $.trim(input.val()) == originalvalue ){ input.val(); }   
10.       });   
11.       input.blur( function(){   
12.           if( $.trim(input.val()) ==  ){ input.val(originalvalue); }   
13.       });   
14.   }  

 

3. 在新視窗中開啟連結
1.       $(document).ready(function() {   
2.          //Example 1: Every link will open in a new window   
3.          $(`a[href^=”http://”]`).attr(“target”“_blank”);   
4.         
5.          //Example 2: Links with the rel=”external” attribute will only open in a new window   
6.          $(`a[@rel$=`external`]`).click(function(){   
7.             this.target = “_blank”;   
8.          });   
9.       });   
10.   // how to use   
11.   <A href=“http://www.opensourcehunter.com” rel=external>open link</A>  
4. 檢測瀏覽器
: 在版本jQuery 1.4中,$.support 替換掉了$.browser 變數。
1.       $(document).ready(function() {   
2.       // Target Firefox 2 and above   
3.       if ($.browser.mozilla && $.browser.version >= “1.8” ){   
4.           // do something   
5.       }   
6.         
7.       // Target Safari   
8.       if( $.browser.safari ){   
9.           // do something   
10.   }   
11.     
12.   // Target Chrome   
13.   if( $.browser.chrome){   
14.       // do something   
15.   }   
16.     
17.   // Target Camino   
18.   if( $.browser.camino){   
19.       // do something   
20.   }   
21.     
22.   // Target Opera   
23.   if( $.browser.opera){   
24.       // do something   
25.   }   
26.     
27.   // Target IE6 and below   
28.   if ($.browser.msie && $.browser.version <= 6 ){   
29.       // do something   
30.   }   
31.     
32.   // Target anything above IE6   
33.   if ($.browser.msie && $.browser.version > 6){   
34.       // do something   
35.   }   
36.   });  
5. 預載入圖片
1.       $(document).ready(function() {   
2.          jQuery.preloadImages = function()   
3.         {   
4.            for(var i = 0; i“).attr(“src“, arguments[i]);  
5.         }  
6.       };  
7.       // how to use  
8.       $.preloadImages(“p_w_picpath1.jpg”);   
9.       });  

由於文章字數限制 其他內容請到http://www.cnblogs.com/ywqu/archive/2010/03/01/1675355.html 檢視。