-1

我将不胜感激任何可以帮助我的主题。

我的 HTML 代码看起来像这样..

        <div class="product-filter clearfix">
        <div id="product-filter" class="display">
        <span style="float: left;">Display:</span>
        <button class="list btn btn-small">List</button>
        <button class="grid active btn btn-small">Grid</span></button>
        </div>

        <div class="filter-items">
        <div class="col-sm-12 col-md-3 col-lg-3">
        some text
        </div>
        </div>
        </div>

我需要的是，当单击“列表按钮”时，它应该向其中添加“活动”类并从“网格按钮”中删除“活动”类。此外，它还应该从#filter-items div 中删除所有“col-md-* 和 col-lg*”类，并相应地添加 col-md-5 和 col-lg-5。反之亦然，它应该在单击 Grid 按钮时表现

4

1 回答 1

0

对于您的 HTML，您需要向按钮添加一个 ID：

<button id="btnList" class="list btn btn-small">List</button>

然后在 JavaScript 中你有以下内容（这将使所有网格都处于活动状态，对于单个网格，给它一个 ID 并使用哈希 (#)）：

$("#btnList").click(function() {
    $(".grid").addClass("active");
});

我很同意上面的评论。这是一个非常基本的问题，这里的 jQuery 文档实际上已经回答了这个问题：

jQuery API .click() 文档

jQuery API CSS 文档

于 2013-11-14T18:58:12.540 回答