本文實例講述了JQuery擴展對象方法操作。分享給大家供大家參考，具體如下：

應項目需求，對JQuery進行了一個擴展，需求如下：

項目中需要在瀏覽器右下角提示操作錯誤和系統(tǒng)提示內容，并有滑動移出和關閉的效果，所以自己寫了一個效果還可以的彈出框來。就是給JQuery添加了一個方法ShowMsg。

先上代碼：

$.fn.extend({  ShowMsg: function (width, height, msgTitle_, msgContent_) {      var TopY = 0; //初始化元素距父元素的距離      $("#messageTitle").html(msgTitle_);      $("#messageResDes").html(msgContent_);      $(this).css("width", width + "px").css("height", height + "px"); //設置消息框的大小      $(this).slideDown(1000); //彈出      $("#messageTool").css("margin-top", -height); //為內容部分創(chuàng)建高度 溢出      $("#message_close").click(function () {//當點擊關閉按鈕的時候        if (TopY == 0) {          $("#message").slideUp(1000); //這里之所以用slideUp是為了兼用Firefox瀏覽器        }        else {          $("#message").animate({ top: TopY + height }, "slow", function () { $("#message").hide(); }); //當TopY不等于0時 ie下和Firefox效果一樣        }        return false;      });      $(window).scroll(function () {        $("#message").css("top", $(window).scrollTop() + $(window).height() - $("#message").height()); //當滾動條滾動的時候始終在屏幕的右下角        TopY = $("#message").offset().top; //當滾動條滾動的時候隨時設置元素距父原素距離      });      setTimeout(function () {        if (TopY == 0) {          $("#message").slideUp(1000); //這里之所以用slideUp是為了兼用Firefox瀏覽器        }        else {          $("#message").animate({ top: TopY + height }, "slow", function () { $("#message").hide(); }); //當TopY不等于0時 ie下和Firefox效果一樣        }        return false;      }, 8000); //8s后自動滑動關閉    }})

代碼一目了然，注釋很清楚。下面呢，主要說下怎樣對JQuery進行擴展吧。

上面的擴展我用了 $.fn.extend進行了擴展，是對JQuery的原生對象進行了方法的擴展，JQuery的擴展主要分為對JQuery本身類進行擴展（JQuery.extend）和對對象的進行方法擴展($.fn.extend)。下面分作說明：

1、用JQuery.extent對JQuery本身進行擴展：

JQuery.extend({  showInfor:function(0{      //do something  }});

怎么用上面這個呢，看下面：

$.showInfor();//這樣就調用到了

2、用$.fn.extend進行方法擴展：

本文開始使用例子就是，下面直接看調用方法：

$("#messageBox").ShowMsg(230,100,"系統(tǒng)提示","提示信息");

說明：$.fn.extend是給JQuery的所有對象進行擴展方法，即只要JQuery可以定位到的對象，都可以使用這個方法。所以只要先定位到改對象，直接調用即可。