Verhindern, dass javascript onclick auf untergeordnetes element

Ok, einfache Frage:

<div onclick="javascript:manualToggle(this)">
    <span>Allowed to click</span>
    <span>Not allowed to click</span>
    <span>Allowed to click</span>
</div>

Ohne Replikation der manualToggle auf die 2 umfasst, die erlaubt sind, um zu klicken, wie kann ich verhindern, dass das "Nicht erlaubt, klicken Sie auf" span von Brand-Eltern div onclick-Ereignis aus, wenn es angeklickt wird?

InformationsquelleAutor Paul | 2009-09-16

  1. 2

    Benötigen Sie einen event-handler (es ist sehr einfach, dies zu tun in so etwas wie jQuery), fängt Klicks für die Spannweiten innerhalb der div-und nur löst die Funktion aus, wenn z.B. die Spannweite hat/hat nicht eine bestimmte Klasse.

    InformationsquelleAutor Dan Herd

  2. 16

    Geben Sie die Zeitspanne ein id-attach onclick-Ereignis, um es und verwenden Sie

    JQuery sample

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

    event.stopPropagation(): Stoppt die sprudelnden einer Veranstaltung zu übergeordneten Elementen, die Verhinderung jeglicher übergeordneten Handler benachrichtigt werden, der Fall.

    Ist der down-vote für ein jQuery-Antwort
    Ich ging für etwas ähnliches, aber nicht mit stopPropagation. (Ich habe noch nicht gestimmt, irgendetwas in dieser Frage...)
    Es gibt einen Unterschied zwischen richtiger Antwort und eine Lösung, die funktionierte. Dies ist tatsächlich eine richtige Antwort auf diese Frage. Danke!

    InformationsquelleAutor rahul

  3. 7

    Würde es Sinn machen, verwenden Sie eine Bibliothek, aber ohne Sie können versuchen, diese (bearbeitet mit einer ganzen Seite zu testen):

    <html><head></head>
<body>
<script type="text/javascript"><!--
function manualToggle(val)
{
    alert(val.id);
}

--></script>

<div id="test" onclick="manualToggle(this);">
    <span>Allowed to click</span>
    <span onclick="event.cancelBubble=true;if (event.stopPropagation) event.stopPropagation();">Not allowed to click</span>
    <span>Allowed to click</span>
</div>
</body>
</html>
    event? e? es scheint etwas zu fehlen
    Thx, e funktioniert nicht, ich habe nur getestet, es in einem cancelBubble Browser, ich habe es geändert Ereignisses (das Fenster.Veranstaltung), und stellen Sie einige Test-code drin. Es funktioniert zumindest im FF 3.5 und dem IE7

    InformationsquelleAutor Daff

  4. 1

    mit mootools können Sie die Methode stopPropagation:

    $('myChild').addEvent('click', function(ev){
    ev.stopPropagation(); //this will prevent the event to bubble up, and fire the parent's click event.
});

    sehen http://mootools.net/docs/core/Native/Event#Event:stopPropagation

    sehen auch diese sehr ähnliche Frage: Wie kann ich verhindern, dass ein onclick-Ereignis von feuern, die für das parent-element als Kind geklickt?

    yay, downvote eine perfekt gültige (und funktionierende) Antwort!
    downvote prolly für die js-Bibliothek, die Sie vorschlagen, wie phoenix, die vorschlagen, jQuery
    die Verwendung von Bibliotheken ist die einfachste (und die meisten browser-kompatibel) Weg
    Ich verwendet die akzeptierte Antwort auf swap ein paar bits Runde und jQuery verwenden zu erreichen, was ich brauchte. Danke für deine Antwort obwohl. (Ich habe noch nicht gestimmt, irgendetwas in dieser Frage...)

    InformationsquelleAutor knittl

  5. 0

    Mögliche Lösung: geben Sie dem span-Tag mit id ' s und überprüfen, ob die angeklickte id darf angeklickt werden, in Ihrer Funktion

    schlechte Idee: Sie wissen nicht, welche Spanne geklickt wird, da Sie die Funktion aufrufen, von Ihrem div...

    InformationsquelleAutor Natrium

Schreibe einen Kommentar