Question

好的，所以我有这个HTML，我正在尝试设计它，以便购物车的每个其他行从白色变为灰色。我知道CSS3可能更容易，但由于这需要支持IE7，我认为jQuery可能是更好的途径。

        <div id="checkoutTable">
        <div id="checkoutRow" class="bold headline">
            <div id="checkoutCell" class="headline">Item <br>Number</div>
            <div id="checkoutCell" class="headline itemName">Item <br>Name</div>
            <div id="checkoutCell" class="headline">Quantity <br>Per Unit</div>
            <div id="checkoutCell" class="headline">Units Free <br>Remaining</div>
            <div id="checkoutCell" class="headline">Units <br>Ordered</div>
            <div id="checkoutCell" class="headline">Cost Per Unit <br>(USD)</div>
            <div id="checkoutCell" class="headline">Total Cost <br>(USD)</div>
        </div>
        <div id="checkoutRow" class="center cartCheckout">
            <div id="checkoutCell" class="first">FLT199</div>
            <div id="checkoutCell" class="first itemName">Vehicle Flyer</div>
            <div id="checkoutCell" class="first">1</div>
            <div id="checkoutCell" class="first">20</div>
            <div id="checkoutCell" class="first"><input name="unitsOrdered" id="" size="5"></div>
            <div id="checkoutCell" class="first">$10.00</div>
            <div id="checkoutCell" class="first">$0.00</div>
        </div>
        <div id="checkoutRow" class="center cartCheckout">
            <div id="checkoutCell" class="first">FLT199</div>
            <div id="checkoutCell" class="first itemName">Vehicle Flyer</div>
            <div id="checkoutCell" class="first">1</div>
            <div id="checkoutCell" class="first">20</div>
            <div id="checkoutCell" class="first"><input name="unitsOrdered" id="" size="5"></div>
            <div id="checkoutCell" class="first">$10.00</div>
            <div id="checkoutCell" class="first">$0.00</div>
        </div>
    </div>

然后我认为这个jQuery可以做到这一点，但它不起作用。

  $(function() {
    $(".cartCheckout:even").css("background", "#ccc;");
  });

Answer 1

您在颜色;中有一个额外的#ccc;无效。如果您将其更改为#ccc，它将如演示中所示工作。

$(function() {
    $(".cartCheckout:even").css("background", "#ccc");
  });

请参阅fiddle demo

Answer 2

试试这个：

$(document).ready(function () {
    $(".cartCheckout:even").css("background", "#ccc");
});

这是一个有效的代码 - http://jsfiddle.net/maximua/6fwX4/

jQuery每隔一个背景灰色

2 个答案: