Douban是2.0 社區里面比較成功的一個產品, 里面ajax技術也做得不錯, 把它的源碼拿來研究了一下, 它在頁面上使用了jquery,  我比較喜歡它的一體式的事件處理機制，不用寫很多的事件綁定代碼，只需要通過一定的命名規則就可以自動給頁面元素加上一些功能, 它上面幾乎所有的功能都通過這個實現, 配合jquery強大的選擇器，代碼看起來比較簡潔清晰.  下面我們就來看看它的一些核心部分. 我使用的是jquery 1.2.3，壓縮之后29kb大小, 速度感覺上比以前有比較大的改善.廢話不多說了，直接看看代碼吧. 另外推薦一下blueprint 這個css框架，還挺好用的.

 Object();

{
    this.listeners = new Object();
}

{
    var lst = this.listeners[msg];

    if(lst != null){
        for(var o in lst){
            lst[o](widgetObj, data);
        }
    }
}

{
    var lst = this.listeners[msg];
    if (lst) {
        lst.push(callback);
    } else {
        this.listeners[msg] = [callback];
    }
}

{
    var lst = this.listener[msg];
    if (lst != null){
        lst = lst.filter(function(ele, index, arr){return ele!=callback;});
    }
}

 Bowtech.EventMonitor();

//

//

//

{
    var re = /a_(/w+)/; //正則表達式獲取ID.
    var fns = {};
    $(".j", root).each(function(i) {
        var m = re.exec(this.className);
        if (m) {
            var f = fns[m[1]];
            if (!f) { //如果事件處理函數不存在則創建函數對象.
                f = eval("Bowtech.init_"+m[1]); 
                fns[m[1]] = f;//調用綁定函數.
            }
            f && f(this);
        }
    });
}

//

//

//

{
    load_event_monitor(document);
}

);

//

{
    var eid = $(o).attr("id").split("-")[1];
    var fo = $("#f-"+eid);
    var unfo = $("#unf-"+eid);
    
    fo.click(function() {
       $(o).hide();
       unfo.show();
       fo.hide();
    });
    unfo.click(function() {
        $(o).show();
        fo.show();
        unfo.hide();
    });
}

jQuery.fn.extend(

{
    set_caret: function(){
        if(!$.browser.msie) return;
        var initSetCaret = function(){this.caretPos = document.selection.createRange().duplicate()};
        this.click(initSetCaret).select(initSetCaret).keyup(initSetCaret);
    }, 
    insert_caret:function(textFeildValue){
        var textObj = this[0];
        if(document.all && textObj.createTextRange && textObj.caretPos){
            var caretPos=textObj.caretPos;
            caretPos.text = caretPos.text.charAt(caretPos.text.length-1) == '' ? textFeildValue+'' : textFeildValue;
        } else if(textObj.setSelectionRange){
            var rangeStart=textObj.selectionStart;
            var rangeEnd=textObj.selectionEnd;
            var tempStr1=textObj.value.substring(0,rangeStart);
            var tempStr2=textObj.value.substring(rangeEnd);
            textObj.value=tempStr1+textFeildValue+tempStr2;
            textObj.focus();
            var len=textFeildValue.length;
            textObj.setSelectionRange(rangeStart+len,rangeStart+len);
            textObj.blur();
        } else {
            textObj.value+=textFeildValue;
        }
    }
}

it知識庫：豆瓣的jQuery使用技巧，轉載需保留來源！

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。