jquery event namespace bubbling問題

Question

我在開發jQuery插件時偶然發現了事件namespacing的一個問題。

下面是HTML

<div class="parent"> 
    <div class="child"> 
    </div> 
</div> 

<a class="btn-a">trigger a</a> 
<a class="btn-b">trigger b</a> 
<a class="btn-c">trigger c</a> 

這裏是jQuery的

jQuery('#content div.child') 
    .bind('a.a',function(){alert('a-child');}) 
    .bind('a.b',function(){alert('b-child');}) 
    .bind('a.c',function(){alert('c-child');}); 


jQuery('#content div.parent') 
    .bind('a.b',function(){alert('b-parent');}) 
    .bind('a.c',function(){alert('c-parent');}); 


jQuery('a.btn-a') 
    .click(function(){ 
     jQuery('#content div.child').trigger('a.a'); 
    }); 


jQuery('a.btn-b') 
    .click(function(){ 
     jQuery('#content div.child').trigger('a.b'); 
    }); 


jQuery('a.btn-c') 
    .click(function(){ 
     jQuery('#content div.child').trigger('a.c'); 
    }); 

總之，我附上一個命名空間中的事件監聽器給孩子和家長創造三個按鈕觸發每個事件（aa，ab，ac）。請注意，父級只能監聽a.b和a.c.當我點擊觸發a.a的按鈕時，只有a.a的div.child監聽器被觸發，但整個'a'命名空間事件冒泡到div.parent監聽器a.b和a.c，並觸發它們。我的問題是，我仍然會如何使用事件命名空間，但只有預期的事件會冒泡（即a.a是唯一一個會觸發孩子和父母的事件）。我知道stopPropagation並停止ImmediatePropagation。我不想把這些放在孩子a.b和a.c聽衆身上，因爲有時候我確實希望他們泡泡。例如，當我觸發孩子的'a.b'時，我期望'a.b'和只有'a.b'事件由孩子和父母處理。

感謝

Answer 1

我不是問題完全肯定，但好像這是你想要的行爲：http://jsfiddle.net/cHrSG/

命名空間是後的事件，而不是之前的，所以格式event.namespace，the jQuery docs have a thorough read here。如果你交換他們在你的代碼有預期的效果，至少我認爲這是你所期望的最好的，我可以從這個問題講：

jQuery('#content div.child') 
    .bind('a.a',function(){alert('a-child');}) 
    .bind('b.a',function(){alert('b-child');}) 
    .bind('c.a',function(){alert('c-child');}); 
jQuery('#content div.parent') 
    .bind('b.a',function(){alert('b-parent');}) 
    .bind('c.a',function(){alert('c-parent');}); 
jQuery('a.btn-a') 
    .click(function(){ 
     jQuery('#content div.child').trigger('a.a'); 
    }); 
jQuery('a.btn-b') 
    .click(function(){ 
     jQuery('#content div.child').trigger('b.a'); 
    }); 
jQuery('a.btn-c') 
    .click(function(){ 
     jQuery('#content div.child').trigger('c.a'); 
    });​