Javascript: mehrere Ereignisse feuern aus einer Aktion

Question

Ich habe ein onclick -Ereignis an eine Region in meiner Seite angefügt, die eine bestimmte Aktion ausgelöst wird, wenn der Benutzer darauf klickt (natürlich). Ich habe dieser Region kürzlich ein Bild hinzugefügt. Wenn der Benutzer auf dieses Bild klickt, möchte ich, dass eine andere Aktion stattfindet, und ich möchte nicht, dass die Aktion für die gesamte Region ausgeführt wird. Ich finde jedoch, dass beide Ereignisse ausgelöst werden, wenn man auf das Bild klickt. Wie kann ich die bereichsweite Aktion unterdrücken, wenn auf das Bild geklickt wird?

Answer 1

darit korrekt ist, müssen Sie das Ereignis verhindern, sprudelt (ausbreitende):

function imgEventHandler(e) { 
    // ^notice: pass 'e' (W3C event) 

    // W3C: 
    e.stopPropagation(); 

    // IE: 
    if (window.event) { 
     window.event.cancelBubble = true; 
    } 

} 

Answer 2

Im Ereignishandler für das Bild tun

event.cancelBubble = true; 

und dann am Ende tun

return false; 

Answer 3

Das Problem, das Sie in laufen als Ereignis sprudelnden bekannt ist. Das Klickereignis des Bildes blubbert an allen übergeordneten Elementen dieses Knotens. Sie möchten die Blasenbildung abbrechen.

Der beste Weg, dies über alle Browser hinweg zu tun, ist die Verwendung eines JavaScript-Frameworks. jQuery hat eine sehr einfache Möglichkeit, dies zu tun. Andere Frameworks haben ähnliche Mechanismen, um das Blubbern aufzuheben. Ich kenne jQuery nur am besten.

Zum Beispiel Sie so etwas wie dies in jQuery tun könnte:

$('img').click(function() { 
    // Do some stuff 

    return false;// <- Cancels bubbling to parent elements. 
});