1. 程式人生 > 實用技巧 >jquery 自定義擴充套件方法

jquery 自定義擴充套件方法

jquery雖然不是是最流行的JS框架了,但是一些自定義JS方法也是想總結下的,封裝到Jquery中,呼叫起來也挺方便的。

方式一:

(jQuery.fn.setApDiv=function () {
        //apDiv浮動層顯示位置居中控制
        var wheight=$(window).height();
        var wwidth=$(window).width();
        var apHeight=wheight-$("#apDiv").height();
        var apWidth=wwidth-$("#apDiv").width();
        $("#apDiv").css("top",apHeight/2);
        $("#apDiv").css("left",apWidth/2);
    })
或者:
(function ($) {
        $.fn.extend({
            //彈窗蒙層
         ShowLoadDialog : function () {
        //apDiv浮動層顯示位置居中控制
        var wheight=$(window).height();
        var wwidth=$(window).width();
        var apHeight=wheight-$("#apDiv").height();
        var apWidth=wwidth-$("#apDiv").width();
        $("#apDiv").css("top",apHeight/2);
        $("#apDiv").css("left",apWidth/2);
             }
        })
})(jQuery)    

呼叫程式碼:

$("#apDiv").setApDiv();

方式二:

  jQuery.extend({
              // 設定 apDiv
            setApDiv:function () {
            //apDiv浮動層顯示位置居中控制
            var wheight=$(window).height();
            var wwidth=$(window).width();
            var apHeight=wheight-$("#apDiv").height();
            var apWidth=wwidth-$("#apDiv").width();
            $("#apDiv").css("top",apHeight/2);
            $("#apDiv").css("left",apWidth/2);
            }
      });    
或者:
(function ($) {
        $.extend({
            //彈窗蒙層
            ShowLoadDialog : function () {
              // 設定 apDiv
            setApDiv:function () {
            //apDiv浮動層顯示位置居中控制
            var wheight=$(window).height();
            var wwidth=$(window).width();
            var apHeight=wheight-$("#apDiv").height();
            var apWidth=wwidth-$("#apDiv").width();
            $("#apDiv").css("top",apHeight/2);
            $("#apDiv").css("left",apWidth/2);
            }
     })})(jQuery)

呼叫程式碼:

$.setApDiv();

三、擴充套件:

jQuery中Ajax提交,針對Form窗體,我們採用的方式就是去除input值,然後組成Json或者其他方式提交,如果重複的用$("#vid").val(),這種方式處理,顯得很繁瑣,能不能用其他傳送提交表單,查閱資料之後,發現有個map方法,可以解決問題,程式碼貼上如下:

$.ajax({
   var str_data=$("#dlg_form input").map(function(){
  return ($(this).attr("name")+'='+$(this).val());
}).get().join("&") ;
   type: "POST",
   url: "some.php",
   data: str_data,
   success: function(msg){
     alert( "Data Saved: " + msg );
   }
});

參考不錯的部落格文章地址:http://www.cnblogs.com/nangong/archive/2013/07/23/3208302.html