对jQuery干的修改

对jQuery做的修改

jQuery 基本库确实给我们带来了很多的方便，但是因为其fn的扩展方式在项目中实在是灵活度欠缺；

而widget模式虽然具备了一定的灵活度，但是还是有一定的欠缺

?

下面是我对jQuery做了修改后写的一些代码

?

吸收了一部分prototype.js 面向对象的方式，抛弃了widget的扩展模式，抛弃了 tabs.tabs("swidth","12121") 这种调用模式，使用 obj.method(args) 的调用模式

?

添加了prototype.js 中 function(){}.bind(this,arg1,arg2) 的闭包模式，这样在面向对象中就解决了和jQuery 闭包调用this 的冲突

....method1:function(){       $.getJSON(window.cp + "/profile/" + dotx.conf.userName + "?act=loadGroup&group=" + groupId,this.showGroup.bind(this));},showGroup:function(group){...}....

?

完整的模块js 代码

profile.js

?

?

;(function($){$.dotx = $.dotx || {} ;$.dotx.Profile = clazz.create();$.extend($.dotx.Profile.prototype,{init:function(conf){this.groupIpt = $("#contact-group");this.itemsDiv = $("#contact-group-items");this.addBtn = $("#add-contact-btn");this.bindEvent();},bindEvent:function(){var t = this ;this.groupIpt.toggleBtn({callback:function(groupId,groupName){t.addBtn.html("<b>添加联系人</b>&nbsp;(" + groupName + ")");t.loadGroup(groupId);}});},loadGroup:function(groupId){var t = this ;this.itemsDiv.html("loading...");$.getJSON(window.cp + "/profile/" + dotx.conf.userName + "?act=loadGroup&group=" + groupId,function(group){t.showGroup(group);});},showGroup:function(group){this.itemsDiv.empty();var items = group.items || [];var i , len = items.length ;if(len > 0 ){for(i = 0; i < len ; i ++){this.addItem(items[i]);}}else{this.itemsDiv.html("分组无联系人");}},addItem:function(item){var groupId = this.getGroupId();this.itemsDiv.append("<div id="contact-group-item-" + item.id + "" style="height:30px;line-height:30px;border-bottom:1px dashed #ccc;">" + "<span style="width:177px;display:inline-block;" title="@" + item.userName + "">" + item.contactName  + (groupId == "all" ? "<span class="desc">&nbsp;(" + (item.groupName || "全部") + ")</span>" : "")+ "</span>" + "<a href="javascript:profile.deleteContact('" + item.id + "');void(0);" class="link-btn-b">删除</a></div>");},showAddContactWin:function(){var t = this ;var txt = "<div id="contact-add"></div>" ;jQuery.prompt(txt,{loaded:function(){$("#contact-add").load(window.cp + "/profile/" + dotx.conf.userName + "?act=contactAdd&group=" + t.getGroupId());},buttons: {"关闭": false }});},deleteContact : function(contactId){if(window.confirm("确定删除该联系人么？")){jQuery.post(window.cp + "/profile/" + dotx.conf.userName + "?act=deleteContact&contactId=" + contactId,function(ret){if(ret)$("#contact-group-item-" + contactId).remove();});}},searchContacts:function(){var keyword = $("#contact-search-keyword").val();var div = $("#contact-group-search-items");if(keyword){div.html("Loading...");div.load(window.cp + "/profile/" + dotx.conf.userName + "?act=searchContacts&keyword=" + keyword);}},addContact:function(userId){var t = this ;var groupId = this.getGroupId();$.post(window.cp + "/profile/" + dotx.conf.userName + "?act=addContact&user=" + userId + "&group=" + groupId,function(){t.loadGroup(groupId);});},getGroupId:function(){return this.groupIpt.val();}});})($);

?

base.js 基本包，需要引入

?

;(function($){/* prototype.js 中 的方法绑定模式 ---------------------- */Function.prototype.bind = Function.prototype.bd = function(){var method = this ;var obj = arguments[0];var args = arguments;return function(){var newArgs = [];var i ,len = args.length ;if(len > 1){for(i = 1; i < len ; i ++){newArgs.push(args[i]);}}len = arguments.length ;for(i = 0 ; i < len ; i ++){newArgs.push(arguments[i]);}method.apply(obj,newArgs);}};                   

                // 面向对象的修改window["class"] = window.clazz = {create:function(){function klass(){      this.init.apply(this, arguments);    }    if (!klass.prototype.init)      klass.prototype.init = function(){} ;    klass.prototype.constructor = klass ;    return klass ;}};})(jQuery);

?

?