jquery-mobile - jquery mobile中列表的交替颜色

Question

是否有可能在 jQuery Mobile 中有一个列表，该列表对列表的奇数成员具有一种颜色，而对于同一列表中的偶数成员具有不同的颜色。例如，在列表中，第一个列表项将为灰色，而对于其他项，列表颜色将为白色。这可以用 jQuery Mobile 完成吗？

我还应该提到，此列表将使用 ajax 响应构建。

Answer 1

我不认为你已经尝试过任何东西。但是我已经为您简化了该功能。只需使用 ajax 代替循环，其余的都是一样的

var swatch = ['a', 'b'];
$list = $("#list");

for (var i = 0; i < 5; i++) {
    $list.append("<li data-theme='" + swatch[i % 2] + "'>List Item</li>");
}
$list.listview('refresh');

链接：http: //jsfiddle.net/androdify/ahWzh/

Answer 2

        <div data-demo-html="true">
            <ul data-role="listview">
                <li data-theme="a">Acura</li>
                <li data-theme="b">Audi</li>
            </ul>
        </div><!--/demo-html -->

交替 data-theme 属性应该可以解决问题。

Answer 3

在您的 CSS 中，添加以下两行：

ul.ui-listview li:nth-child(even) a { background-color: #ffd800; }
ul.ui-listview li:nth-child(odd) a { background-color: #000; }