jQuery自定义类封装

----- 写法1 -------

var uploadProcess = (function ($) {
    var pub = {
        delete: function (element) {
            var params = {upload_id:$(element).data('id')};
            var urlDelete = '<?= Url::to('delete-upload')?>';
            $.post(
                urlDelete,
                params,
                function (data) {
                    if(data.result>0){
                        $(element).closest('div.att-item').remove();
                    }
                    //console.log(data);
                }, 'json');
                
            return false;
        }
    }
    return pub;    
})(window.jQuery);

>>方法1调用demo

$('.upload-attachment-list').on('click', 'a.delete-item', function(){
        if(confirm('Confirm delete?')){uploadProcess.delete(this)}      
    });

----- 写法2 -------

(function (factory) {
  if (typeof define === 'function' && define.amd) {
    // AMD. Register as anonymous module.
    define(['jquery'], factory);
  } else if (typeof exports === 'object') {
    // Node / CommonJS
    factory(require('jquery'));
  } else {
    // Browser globals.
    factory(jQuery);
  }
})(function ($) {

  $.DragField = function (arg) {
        var name = "你好";                 //私有变量，外部无法访问
        this.testFun = function () {     //this.testFun方法，加上了this，就是公有方法了，外部可以访问。
            alert(arg.title + "," + name);
        };
    };

});

----- 写法3 -------

(function ($) {

    $.DragField = function (arg) {

        var name ="你好";

        this.testFun =function () {

            alert(arg.title + "," + name);

        };

    };

})(jQuery);

 

方法2，方法3 使用方法：

var a =new $.DragField({ title:"Hi" });

var b =new $.DragField({ title:"Hello" });

a.testFun();

b.testFun();