Domanda

Ho una tabella che ha le righe che sono contrassegnati da una classe. Queste righe dovrebbero essere zebra a strisce. L'avvertenza è che essi non sono sempre consecutivi.

ho cercato di corrispondenza dalla tabella e il nome della classe, ma il risultato finale è sempre corretto. Quello che sta accadendo è che la striping sarà applicata a livello di tabella e quindi abilitato solo sulle righe con la classe.

Che cosa devo cambiare per fare questo lavoro come intendo?

Script

function FormatTable()
{
   $("#TableId .arbitrarySelector:nth-child(2n+1)" ).addClass('anotherEquallySpecialRow')
}

HTML

<table id="TableId" onclick="FormatTable()">
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should Not be Changed and is Not</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should NOT be changed but is</div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should Not be Changed and is Not</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should Not be Changed and is Not</div></td>
    </tr>
</table>
È stato utile?

Soluzione

Si potrebbe essere fare questo troppo difficile. Se si vuole fare zebra striping, perché non utilizzare qualcosa come il : selettore dispari e il cambiamento la classe seconda. Qualcosa di simile a questo ...

// Add zebra striping.
$('.arbitrarySelector:odd').addClass('zebra');

E poi il CSS sarebbe qualcosa di simile ...

.zebra 
{
    background-color: #dddddd;
}
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top