Ziel klicken Sie auf

Suchen Sie diesen code:

<div>
    <a href = "#"><span>Click me MAN !</span></a>
</div>

<script type = "text/javascript">
    window.onload = function () {
        document.body.addEventListener ("click", function (event) {
            var target = event.target;

            alert ("Returns \"" + target.nodeName + "\". Just want \"" + target.parentNode.nodeName + "\"")
        }, false);
    }
</script>

Können Sie sehen, das element "span" in ein "link", wenn der "link" auf das aktuelle Ziel ist das gleiche "Spannweite". Wie kann die "event.Ziel der" Rückkehr "link" anstelle von "span".

Dank und Nein, ich will nicht von "parentNode".

  • Warum genau sind Sie, hören für einen Klick auf den Körper und nicht nur die Ausrichtung der Anker-tag?
  • Es ist eine gute Idee, reduzieren Sie die Ereignis-Handler auf ein minimum und nutzen die Tatsache, dass die meisten Veranstaltungen, die Blase, bis der DOM-Baum, eine Technik, bekannt als event-delegation. Das mag sein, was der OP tut.
InformationsquelleAutor Caio | 2011-01-10
  1. 7

    Mit Ihrem Ansatz, Sie müssen entweder manuell traverse den DOM bis Sie auf eine <a> element, oder bringen Sie die Zuhörer auf den link selbst und verwenden this.

    Minimierung der Anzahl der Ereignis-Listener wird in der Regel eine gute Idee, also hier ist ein Beispiel, wie die zum Durchlaufen des DOM. Beachten Sie, dass der Ereignis-listener wird nicht im IE funktioniert, die nicht die Unterstützung der addEventListener() Methode von DOM-Knoten.

    Live-Beispiel: http://jsfiddle.net/timdown/pJp4J/

    function getAncestor(node, tagName) {
    tagName = tagName.toUpperCase();
    while (node) {
        if (node.nodeType == 1 && node.nodeName == tagName) {
            return node;
        }
        node = node.parentNode;
    }
    return null;
}

document.body.addEventListener("click", function(event) {
    var target = getAncestor(event.target, "a");
    if (target !== null) {
        alert(target.nodeName);
    }
}, false);
    InformationsquelleAutor Tim Down
  2. 1

    Hinzufügen dieser css-Tipps für JavaScript.
    Erhalten Sie event.Ziel Sie wollen.

    a > *,
button > *{
  pointer-events:none;
}
    InformationsquelleAutor piayo
  3. 0

    Können Sie nicht nur verwenden 

    <span><a href="#">Click me</a></span> ?
    • Was ist der Punkt, der span dann? Es wird völlig nutzlos.
    • Wie Sie Abbildung? Die Stile aplpied auf es sind immer noch gültig für die Inhalte der link...
    InformationsquelleAutor Cray
Schreibe einen Kommentar