jQuery - Hinzufügen von click-Ereignis auf Div und gehe zum ersten link gefunden

Ich denke, dass ich schon zu viel Zeit auf der Suche nach dieser Funktion, und gerade stecken versuchen, herauszufinden, die schönen, sauberen Weg, es zu tun.

Ist es eine jQuery-Funktion fügt hinzu, dass ein click-Ereignis für alle div hat eine click CSS-Klasse. Wenn das div.click geklickt wird, leitet es den Benutzer auf den ersten link gefunden.

function clickabledivs() {
    $('.click').each(
        function (intIndex) {
            $(this).bind("click", function(){
                window.location = $( "#"+$(this).attr('id')+" a:first-child" ).attr('href');
            });
        }
    );
}

Den code einfach funktioniert, obwohl ich bin mir ziemlich sicher, dass es eine relativ besseren Weg, um es zu erreichen, speziell den Selektor die ich benutze: $( "#"+$(this).attr('id')+" a:first-child" ). Alles schön lange und langsam. Irgendwelche Ideen?

Bitte lassen Sie mich wissen, wenn Sie brauchen mehr details.
Danke!

PS: ich habe festgestellt, dass einige wirklich schöne jQuery-benchmarking-Referenz aus Project2k.de hier:
http://blog.projekt2k.de/2010/01/benchmarking-jquery-1-4/

InformationsquelleAutor Xavi Esteve | 2010-04-15

6

Je nachdem, wie viele dieser div.click Elemente, die Sie haben, möchten Sie vielleicht zu verwenden, event-delegation Griff diese Klicks. Dies bedeutet die Verwendung eines einzigen Ereignis-handler für alle divs, die click Klasse. Dann, im inneren, dass event-handler, wird Ihre callback-Handlungen, auf dessen Grundlage div.click dem Ereignis entstanden ist, aus. Wie diese:
```
$('#div-click-parent').click(function (event)
{
    var $target = $(event.target); //the element that fired the original click event
    if ($target.is('div.click'))
    {
        window.location.href = $target.find('a').attr('href');
    }
});
```
Weniger event-Handler bedeutet eine bessere Skalierung - mehr div.click Elemente, die nicht verlangsamen Ihren event-handling.

Wow, vielen Dank für die tollen und schnellen Antworten. Die Funktion könnte durchaus optimiert werden, viel mehr. Ich bleibe bei der einen Trägt, wird Sie Essen schlägt. Nur ein Ereignis für alle, die div klickt. Danke!!!!
Nur ein kurzes zwicken, "wenn ($target.ist('div.klicken Sie auf')" muss ein zusätzliches ) am Ende. Nochmals vielen Dank!
Hoppla, danke! Ich werde das beheben.
vielen Dank für diese einfache Lösung, versuchte div anklickbar basierend auf h3 Titel ein href " drin und das funktioniert!

InformationsquelleAutor Matt Ball

optimiert delegation mit jQuery 1.7+

$('#div-click-parent').on('click', 'div.click', function () {
   window.location.href = $(this).find('a').attr('href');
});

InformationsquelleAutor Bastian Rang

2

Anstelle der Bindung aller Klicks auf laden, warum nicht binden Sie auf klicken Sie auf? Sollte viel mehr optimal.
```
$(document).ready(function() {
   $('.click').click(function() {
        window.location = $(this).children('a:first').attr('href');
        return false;
    });
});
```
Wo sehen Sie alles, was über die Bindung der Klicks auf laden?

InformationsquelleAutor Jeriko
0

Ich würde wahrscheinlich so etwas tun;
```
$('.click').click(function(e){
  window.location.href = $(this).find('a').attr('href');
});
```
+1 weil Sie die ersten waren, die nicht zu übernehmen, es war sofort ein Kind!
Ich bin mir ziemlich sicher, dass er nur Mittel 'a' statt a.

InformationsquelleAutor David Yell

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.