Howto: div z onclick wewnątrz innego div z onclick javascript

to tylko szybkie pytanie. Mam problem z div z onclick javascript w sobie nawzajem. Kiedy klikam na wewnętrzny div, powinien on uruchamiać tylko javascript onclick, ale javascript zewnętrznego div również jest uruchamiany. W jaki sposób użytkownik może kliknąć na wewnętrzny div bez uruchamiania zewnętrznego javascript?Howto: div z onclick wewnątrz innego div z onclick javascript

<html> 
<body> 
<div onclick="alert('outer');" style="width:300px;height:300px;background-color:green;padding:5px;">outer div 
    <div onclick="alert('inner');" style="width:200px;height:200px;background-color:white;" />inner div</div> 
</div> 
</div> 
</body> 
</html>

Źródło

2010-03-05 Daniel Brink

Duplikat. http://stackoverflow.com/questions/2015041/two-differents-onclick-on-two-divs-one-over-the-other – vpram86

Zduplikowane pytanie, ale lepsze odpowiedzi. –

Zasadniczo istnieją dwa modele zdarzeń w języku JavaScript. Przechwytywanie zdarzeń i Event bulgotanie. W przypadku propagacji, jeśli klikniesz na wewnętrzny element div, wewnętrzne zdarzenie kliknięcia div uruchomi się jako pierwsze, a następnie uruchomi się zewnętrzne kliknięcie div. podczas przechwytywania zdarzeń najpierw zostanie wywołane zewnętrzne zdarzenie div, a następnie wewnętrzne zdarzenie div zostanie odpalone. Aby zatrzymać propagację zdarzeń, użyj tego kodu w swojej metodzie kliknięcia.

if (!e) var e = window.event; 
    e.cancelBubble = true; 
    if (e.stopPropagation) e.stopPropagation();

Źródło

2010-03-05 07:29:13 Adeel

dziękuję, prosta, jasna odpowiedź i działa doskonale –

Dzięki. Doskonała odpowiedź; właśnie tego szukałem. –

return false; z funkcją onclick śródmiejskiego div:

<div onclick="alert('inner'); return false;" ...

Co masz do czynienia ze nazywa event propagation.

Źródło

2010-03-05 07:17:26

Metoda, którą sugerujesz, nie działa. (Przynajmniej nie w żadnej z przeglądarek, które właśnie podwoiłem, sprawdziłem to - Firefox 3.6, IE8.) Zauważ, że twój link faktycznie mówi, że używasz innej metody, którą dałem w mojej odpowiedzi. –

Sprawdź informacji na temat rozmnażania zdarzeń here

W szczególności będziemy chcieli trochę kodu takiego w swoim obsługi zdarzeń, aby zatrzymać zdarzenia z rozmnożeniowego:

function myClickHandler(e) 
{ 
    // Here you'll do whatever you want to happen when they click 

    // now this part stops the click from propagating 
    if (!e) var e = window.event; 
    e.cancelBubble = true; 
    if (e.stopPropagation) e.stopPropagation(); 
}

Źródło

2010-03-05 07:18:09

Dziękujemy! to zadziałało dla mnie – CraZyDroiD

Jest to przypadek bulgotanie zdarzeń .

Można użyć

e.cancelBubble = true; //IE

e.stopPropagation(); //FF

Źródło

2010-03-05 07:21:39 rahul

zajęło mi trochę czasu, aby zrozumieć, ale dostałem go teraz, thx –

Here jest kilka odniesienia, aby pomóc w zrozumieniu javascript wydarzenie stacjonarnego.

Źródło

2010-03-05 07:33:45 Ben

masz dwa "div" i trzy "/ div".

Źródło

2010-07-24 16:27:20 freddie

Jeszcze jeden sposób na przeglądarkach WebKit oparte:

<div onclick="alert('inner'); event.stopPropagation;" ...

Źródło

2012-02-23 00:08:22 user1227168

działa to jednak w następujący sposób: onclick = "alert ('inner'); event.stopPropagation();" –

To zadziałało dla mnie i przetestowałem to na Opera (46), Chrome (59.0.3071.115), FireFox Developer (55.0b9 (32-bit)), Internet Explorer 11 –

To był bardzo pomocny, ale to nie działa dla mnie.

Co zrobiłem, opisano here.

Włożyłem więc warunek do zewnętrznej onclick imprezy:

if(!event.isPropagationStopped()) { 
    window.location.href = url; 
}

Źródło

2012-08-03 07:42:52 shooby

Wystarczy dodać ten kod:

window.event.stopPropagation();

Źródło

2014-04-17 15:47:10 user3438083

To nie działa dla mnie. Najlepsza odpowiedź jest bardziej dokładna. –

Można użyć

$("divOrClassThatYouDontWantToPropagate").click(function(event) { 
 
     event.stopPropagation(); 
 
    });

Źródło

2015-04-22 12:04:44

Howto: div z onclick wewnątrz innego div z onclick javascript

Odpowiedz

Powiązane problemy