2009-12-07 10 views

Antwort

18

Wenn Sie die Click-Handler direkt auf die tr Elemente definiert sind, können Sie die index Methode wie folgt verwenden:

$('#tableId tr').click(function() { 
    var rowIndex = $('#tableId tr').index(this); //index relative to the #tableId rows 
}); 

Wenn das Click-Ereignis auf dem tr Element nicht direkt gebunden ist (wenn Sie ein verwenden Anker, ein Knopf, etc ...), sollten Sie die nächstgelegene tr finden Sie den richtigen Index zu erhalten:

$(selector).click(function() { 
    var rowIndex = $('#tableId tr').index($(this).closest('tr')); 

    return false; 
}); 

Versuchen Sie ein Beispiel here.

+0

Dies wird nicht richtig funktionieren, wenn die Seite mehrere Tabellen hat. Wahrscheinlich am besten nach Geschwister '' Elementen suchen. –

+0

Sollte der Selektor des Aufrufs $ .index() nicht auf die übergeordnete Tabelle von TR beschränkt sein, auf die TR geklickt wurde, statt auf ein generisches Tabellen-Tag? – Sampson

+0

@TM, @ Jonathan: war ein Tippfehler, beschränkt auf ein '# tableId' Element – CMS

0

sollte diese Arbeit:

$('#tableId tr').click(function() { 
    var index = $(this).siblings('tr').index(this); 
}); 

Sie brauchen tr nicht im Aufruf von siblings, wenn Sie Ihre HTML wohlgeformt sind sicher werden.

1

Ihre erste Frage zu beantworten:

$("#id tr").click(function() { 
    alert($("#id tr").index(this)); 
}); 

Wenn Sie gerade tun:

$("table tr").index(this); 

und Sie haben mehrere Tabellen auf der Seite finden Sie ein falsches Ergebnis erhalten.

Dazu müssen Sie den Index nicht wissen, um Zeilen in einer Tabelle nach oben und unten zu verschieben. Zum Beispiel:

<table id="foo"> 
<tr> 
    <td><a href="#" class="up">Up</a> <a href="#" class="down">down</a></td> 
    <td>First row</td> 
</tr> 
<tr> 
    <td><a href="#" class="up">Up</a> <a href="#" class="down">down</a></td> 
    <td>Second row</td> 
</tr> 
<tr> 
    <td><a href="#" class="up">Up</a> <a href="#" class="down">down</a></td> 
    <td>Third row</td> 
</tr> 
</table> 

mit so etwas wie:

$("a.up").click(function() { 
    var row = $(this).closest("tr"); 
    if (row.prev().length > 0) { 
    row.insertBefore(row.prev()); 
    } 
    return false; 
}); 
$("a.down").click(function() { 
    var row = $(this).closest("tr"); 
    if (row.next().length > 0) { 
    row.insertAfter(row.next()); 
    } 
    return false; 
}); 
+0

Guter Punkt, Sie brauchen eigentlich den Index überhaupt nicht. –

Verwandte Themen