empêcher la propagation de l'événement avec Google Closure Library

En utilisant Google Fermeture bibliothèque:empêcher la propagation de l'événement avec Google Closure Library

Comment puis-je gérer en cliquant d'un element par exemple un div mais empêcher le tir du event handler lorsque l'utilisateur clique sur les éléments enfants de cet élément.

Par exemple, dans le code suivant je veux tirer le event handler lorsque l'utilisateur clique div1 mais quand il/elle clique « span1 » Je veux une autre event handler d'être appelé sans tirer le gestionnaire de div1.

<div style="width: 400px" id="div1"> 
<span id="span1">click me to reload</span> 
click here to Toggle accordion 
</div>

MISE À JOUR

code JS:

/**** accordion ***/ 
var panels = goog.dom.getElementsByClass('newsColumnHeader', goog.dom.getElement('accordionContainer')); 

var anims = {}; 
var open = null; 

goog.array.forEach(panels, function(pane){ 
    var animation = new goog.ui.AnimatedZippy(pane, goog.dom.getNextElementSibling(pane)); 
    goog.events.listen(animation, goog.ui.Zippy.Events.TOGGLE, zippyToggle); 
    anims[goog.getUid(animation)] = animation; 
}); 

function zippyToggle(event) {  
    var uid = goog.getUid(event.target);     
    // simple logic - only one open panel in one time 
    if (event.expanded && uid != open) { 
    if (open) { 
     anims[open].setExpanded(false); 
    } 
    open = uid; 
    } 
} 
/******************/   

var refreshVarzesh3 = goog.dom.getElement("btnRefreshVarzesh3"); 
if (refreshVarzesh3 != null) { 
    goog.events.listen(refreshVarzesh3, goog.events.EventType.CLICK, function(event) { 
    /*doing something but not toggling accordion pane*/ 
    }); 
}

HTML CODE:

<body> 
<div class="main"> 
    <div class="top"> 
    <div id="toolbar">   
     <img src="css/img/contact.png" alt="تماس، پیشنهاد، گزارش خطا" title="تماس، پیشنهاد، گزارش خطا"/>   
    </div> 
    <img src="css/img/football_news.gif" alt="آخرین اخبار فوتبال"/> 
    </div> 
    <div class="middle"> 
    <div class="left"></div> 
    <div class="right"> 
     <div class="accordion" id="accordionContainer"> 
     <div class="newsColumnHeader"> 
      <div class="buttons"> 
      <img id="btnRefreshVarzesh3" src="css/img/refresh.png" alt="به روز رسانی" title="به روز رسانی"/>     
      </div> 
      <%=lbls.getString("Varzesh3News")%> 
     </div> 
     <div class="newsList" id="varzesh3NewsContainer"></div> 
     <div class="newsColumnHeader"><%=lbls.getString("PersepolisNews")%></div> 
     <div class="newsList" id="persepolisNewsContainer"></div> 
     <div class="newsColumnHeader"><%=lbls.getString("EsteghlalNews")%></div> 
     <div class="newsList" id="esteghlalNewsContainer"></div> 
     <div class="newsColumnHeader"><%=lbls.getString("NavadNews")%></div> 
     <div class="newsList" id="navadNewsContainer"></div> 
     </div> 
    </div> 
    </div> 
    <div class="bottom"></div> 
</div>

Source

2011-06-27 ehsun7b

Rien ici? http://stackoverflow.com/search?q=prevent+propagation+javascript – mplungjan

pour pur javascript développeurs la réponse est here mais si vous utilisez Google Closure Library le code suivant est en Ough:

event.stopPropagation();

Source

2011-06-27 07:42:03 ehsun7b

dans le gestionnaire d'événements de ce clic, vous devez utiliser preventDefault()

par exemple:

document.getElementById('div1').onclick = function (event) { 
    //your code 
    event.preventDefault(); 
}

Source

2011-06-27 06:38:21 mightyplow

J'ai besoin du code en utilisant les classes Google Closure. – ehsun7b

J'ajoute le code si page dans ma mise à jour. – ehsun7b

Vous devriez lire ce lien pour mieux comprendre l'événement http://www.quirksmode.org/js/events_order.html

Source

2011-06-27 06:44:16 user816867

Juste pour référence Tous les événements de Google Closure proviennent de goog.events.Event

http://docs.closure-library.googlecode.com/git/class_goog_events_Event.html

Exemple: goog.events.BrowserEvents

Alors premier on est stopPropagation

this.getHandler().listen(element ,goog.events.EventType.CLICK, function (e){ 
    e.stopPropagation(); 
    });

Deuxième on est goog.events.Event.stopPropagation est une méthode statique qui appelle à son tour au-dessus de la méthode

goog.events.Event.stopPropagation = function(e) { 
    e.stopPropagation(); 
};

Edit: S'il vous plaît ne pas lire - Dangers of Event Propagation

Source

2013-08-19 21:07:31 dekdev

empêcher la propagation de l'événement avec Google Closure Library

Répondre

Questions connexes