Douban是2.0 社區(qū)里面比較成功的一個(gè)產(chǎn)品, 里面ajax技術(shù)也做得不錯(cuò), 把它的源碼拿來(lái)研究了一下, 它在頁(yè)面上使用了jquery,  我比較喜歡它的一體式的事件處理機(jī)制，不用寫很多的事件綁定代碼，只需要通過(guò)一定的命名規(guī)則就可以自動(dòng)給頁(yè)面元素加上一些功能, 它上面幾乎所有的功能都通過(guò)這個(gè)實(shí)現(xiàn), 配合jquery強(qiáng)大的選擇器，代碼看起來(lái)比較簡(jiǎn)潔清晰.  下面我們就來(lái)看看它的一些核心部分. 我使用的是jquery 1.2.3，壓縮之后29kb大小, 速度感覺(jué)上比以前有比較大的改善.廢話不多說(shuō)了，直接看看代碼吧. 另外推薦一下blueprint 這個(gè)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+)/; //正則表達(dá)式獲取ID.
    var fns = {};
    $(".j", root).each(function(i) {
        var m = re.exec(this.className);
        if (m) {
            var f = fns[m[1]];
            if (!f) { //如果事件處理函數(shù)不存在則創(chuàng)建函數(shù)對(duì)象.
                f = eval("Bowtech.init_"+m[1]); 
                fns[m[1]] = f;//調(diào)用綁定函數(shù).
            }
            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知識(shí)庫(kù)：豆瓣的jQuery使用技巧，轉(zhuǎn)載需保留來(lái)源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。