mit javascript abfangen aller Dokument-link klickt

wie kann ich abfangen, link-Klicks in ein Dokument ein?
es muss cross-Plattform.

Ich bin auf der Suche nach so etwas wie dieses:

//content is a div with innerHTML
var content = document.getElementById("ControlPanelContent");

content.addEventListener("click", ContentClick, false);

 function ContentClick(event) {

    if(event.href == "http://oldurl")
  {
     event.href = "http://newurl";
  }
}

Vielen Dank im Voraus für die Hilfe.

InformationsquelleAutor Jeremy Gwa | 2010-01-25

  1. 20
    for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){
    ls[i].href= "...torture puppies here...";
}

    alternativ, wenn Sie nur wollen, um abzufangen, nicht ändern, fügen Sie einen onclick-handler. Diese wird aufgerufen, bevor die Navigation zu der url:

    var handler = function(){
    ...torment kittens here...
}
for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){
    ls[i].onclick= handler;
}

    Beachten Sie, dass document.links enthält auch AREA Elemente mit ein href Attribut, das nicht nur A Elemente.

    InformationsquelleAutor Roland Bouman

  2. 16

    Was der Fall ist, wo die links generiert werden, während die Seite verwendet wird? Häufig geschieht dies mit der heutigen, komplexer front-end-frameworks.

    Die richtige Lösung wäre wahrscheinlich zu setzen Sie das click-Ereignis-listener auf das Dokument. Dies ist, weil die Ereignisse auf Elemente weitergegeben zu Ihren Eltern und da ein link ist, tatsächlich umgesetzt von den top-die meisten Eltern.

    Dieser Arbeit wird für alle links, ob Sie geladen sind, mit der Seite, oder dynamisch generiert am vorderen Ende an einem beliebigen Punkt in der Zeit.

    function interceptClickEvent(e) {
    var href;
    var target = e.target || e.srcElement;
    if (target.tagName === 'A') {
        href = target.getAttribute('href');

        //put your logic here...
        if (true) {

           //tell the browser not to respond to the link click
           e.preventDefault();
        }
    }
}


//listen for link click events at the document level
if (document.addEventListener) {
    document.addEventListener('click', interceptClickEvent);
} else if (document.attachEvent) {
    document.attachEvent('onclick', interceptClickEvent);
}
    Das ist eine bessere Antwort als es erzeugt weniger event-Handler und deckt Fälle ab, wo die links werden dynamisch erzeugt, z.B. in einem CMS, wie wir arbeiten.
    Beachten Sie, dass <a> aufgewickelt werden kann, um andere Elemente, in dem Fall, dass die Veranstaltung das Ziel nicht tatsächlich A. Beachten Sie auch, dass das nicht funktionieren, wenn der Benutzer verwendet <TAB> zu konzentrieren, den link, und drückt dann <ENTER>. Wenn Sie möchten, abfangen, alles, was, die änderungen der Seite, würden Sie brauchen, um zu ersetzen Sie alle den a-tags und des form-tags und das erkennen von dynamischen Elementen mit MutationObserver.

    InformationsquelleAutor James

  3. 3

    Ich nur fand dies heraus, und es kann helfen, einige Leute. Zusätzlich zum abfangen, wenn Sie wollen nicht zulassen, dass der link zum laden einer anderen Seite oder die aktuelle Seite neu laden. Nur den href, ' # ' (wie in der internen Seite ref-Präfix). Jetzt können Sie diesen link verwenden, um eine Funktion aufzurufen, die Sie während des Aufenthaltes auf der gleichen Seite.

    Update: Dies ist nicht der beste Weg. Mit href="javascript:void(0)" ist oft besser, da Sie nicht zwingen, die Seite neu zu laden. Sie mehr hier
    Beachten Sie, dass diese beiden Arten verhindern, dass Benutzer mit der Rechten Klicken Sie auf Aktionen, auf die links (öffnen in einem neuen tab, etc.)

    InformationsquelleAutor worldsayshi

Schreibe einen Kommentar