首先來看看這樣一個應用場景，網頁上有個鏈接，比如說高級搜索，點擊以后會出現一個搜索面板。由于面板里有很多搜索字段，而這些搜索字段又有很多數據，因此決定采用異步來加載該搜索面板。以jQuery為例，代碼可能會這么寫：

    $('#advance_search’).bind(‘click’, function(e){

        $('#advance_search_panel’).load(‘/xxx/advance_search.html"’);

    });

    但是呢，又需要在加載后做一些處理，比如說隱藏掉正在加載的提示文字或者圖標，好說，就給load加上callback

    ….load(‘…..', function(){

        $('#waiting_message’).hide();

    })

    面板里面有個搜索按鈕，點擊進行搜索，加載完需要綁定click事件，于是我們又在下面加上：

    ….load(‘…..', function(){

        $('#waiting_message’).hide();

        $('#search_button’).bind(‘click’, do_advance_search);

    })

    某一天，其他有些頁面也要加上這個高級搜索，但是呢，加載完成后的處理又都不一樣，有的頁面需要隱藏掉某個div，有的頁面需要綁定一些操作等，這時候怎么辦？難道都去改這個load方法嗎？

    有一種方法可以解決這個問題，加上callback參數用以回調，比如 new AdvancedSearch(callback); 當然，除此以外，其實還有一種更優雅的方法，事件驅動。

    代碼寫起來很簡單，加載完畢后觸發這個事件:

    ….load(‘….', function() {

        $().trigger(‘advanced_search_load_complete’);

})

    需要在加載完成后做某些操作的地方綁定一下事件處理函數即可:

    $().bind(‘advanced_search_load_complete’, function(){

        ……

    });

    封裝的地方不用任何改動，其它地方愛做什么操作就做什么操作，這就是事件驅動的魅力，極大的松耦合。

    總結一下，事件驅動好處是什么呢？

    1. 松耦合的交互，事件發布者和訂閱者無須知道對方的存在。

    2. 多對多的關系，多個事件發布者對應多個訂閱者。

    3. 一個個事件發布出來，針對這些事件作出響應，這就是一個業務場景，每個步驟清晰自然。

    4. 事件發布可以帶參數，事件處理者可以拿到關于該事件的任何數據。

    基于事件驅動的javascript編程模型不同于常見的全局函數隨便調的javascript，它的模塊更內聚，更容易復用，在業務不可預知的前提下，業務代碼改變得更少。

    目標，更漂亮的javascript！事件驅動，我們都來擁抱它。