Toggle-Ein-Und Ausblenden, Nur Einige Zeilen
Ich versuche zum ein - /ausblenden (über einen toggle-Mechanismus) nur bestimmte Zeilen in meiner Tabelle. Ich habe etwas in der Nähe, code ist unten. Was ich Las in anderen Fragen ist dies die Verwendung von style-id ' s und ich haben versucht, aber es scheitert für mich. So, dass ist der Grund, warum ich verwendet, 'hide=yes' und pass, die in der toggle-Funktion.
Dies ist eine Tabelle mit ein paar hundert Einträgen, wenn ich auf Umschalten kann reduzieren bis zu weniger als 30 an einem bestimmten Tag.
Gibt es einen besseren Weg, dies zu tun?
<html>
<head>
<script>
function toggle(thisname) {
tr=document.getElementsByTagName('tr')
for (i=0;i<tr.length;i++){
if (tr[i].getAttribute(thisname)){
if ( tr[i].style.display=='none' ){
tr[i].style.display = '';
}
else {
tr[i].style.display = 'none';
}
}
}
}
</script>
</head>
<body>
<span onClick="toggle('hide');">TOGGLE</span><br /><br />
<table>
<tr ><td >display this row 1</td></tr>
<tr hide=yes ><td>hide this row 1</td></tr>
<tr><td>display this row 2</td></tr>
<tr hide=yes ><td>hide this row 2</td></tr>
<tr hide=yes ><td>hide this row 3</td></tr>
<tr><td>display this row 3</td></tr>
<tr><td>display this row 4</td></tr>
<tr><td>display this row 5</td></tr>
<tr><td>display this row 6</td></tr>
<tr hide=yes ><td>hide this row 4</td></tr>
<tr hide=yes ><td>hide this row 5</td></tr>
<tr><td>display this row 7</td></tr>
<tr hide=yes ><td>hide this row 6</td></tr>
<tr hide=yes ><td>hide this row 7</td></tr>
</table>
</body>
</html>
InformationsquelleAutor ONDEV | 2011-11-19
Du musst angemeldet sein, um einen Kommentar abzugeben.
Dein Ansatz scheint ok, ich schlage vor, Sie deklarieren Variablen
tr
undi
alternativ könnten Sie
class
stattImmer der Klassenname wäre schneller als das finden der Attribute Wert ich denke, Sie können tun einige tests, um sicher zu sein für die Geschwindigkeit
InformationsquelleAutor david