0

asp.net Mvc3 かみそりリストを使用してデータのテーブルを作成しようとしています。また、行の色が交互になるように CSS を追加しようとしています。この部分で誰かが私を助けることができますか？d0 クラスと d1 クラスをループに適用するのを手伝ってください。

<style>
    tr.d0 td {
        background-color: #CC9999;
        color: black;
    }

    tr.d1 td {
        background-color: #9999CC;
        color: black;
    }
</style>

 <table width="100%">
        <tr>
            <th>Name</th>
            <th>Address</th>
            <th>Phone</th>
            <th>Details</th>
        </tr>

        @foreach (var item in Model.Info)
        {     
            <tr>

                <td><span>@item.Name</span></td>
                <td><span>@item.Address</span></td>
                <td><span>@item.Phone</span></td>
                <td><span>@item.Details</span></td>

             </tr>
        }
    </table>
4

3 に答える 3

3

通常の for ループを使用します -

(未テスト)

@for (int i = 0; i < Model.Info.Count; i++) {
  <tr class= @(i%2 ==0 ? "d0" : "d1")>
      <td><span>@Model.Info[i].Name</span></td>
       .....
  </tr>
}

これはコンテンツのレンダリングではなくスタイリングの問題なので、jquery を奇数、偶数行で使用するのはどうでしょうか?

$(document).ready(function () {
    $("table tr:odd").addClass("className"); //make use of more specific css selector
   //likewise for even rows
}
于 2012-12-08T06:16:43.123 に答える
0 
$(document).ready(function () {
    $('table tr:not(.Header):even').addClass('d0');

    $('table tr:not(.Header):odd').addClass("d1");
});

デモ用

于 2013-01-04T11:15:56.063 に答える