0

我正在尝试为产品列表模板切换一个 ID（我知道一个类会更好，但在这种情况下我需要使用一个 ID）。不幸的是，它只适用于第一次点击。完成后我无法切换回来。我究竟做错了什么？

这是我正在使用的代码

$(document).ready(function(){

    $("a.toggle").bind("click", function(e){
        e.preventDefault();

        var theid = $(this).attr("id");
        var thecontainer = $("div#container");

    if($(this).hasClass("active")) { 
        return false;
    } else {

        if(theid == "gridView") {
           $(this).addClass("active");
           $("#listView").removeClass("active");

        thecontainer.removeAttr('id');
        thecontainer.attr('id', 'container');
        }
        else if(theid == "listView") {
            $(this).addClass("active");
            $("#gridView").removeClass("active");

            thecontainer.removeAttr('id');
            thecontainer.attr('id', 'containerList');

            } 
        }

    });
});

这是我用来切换视图的链接的 html。

  <div class="buttonPanel">
    <a id="gridView" class="btnGridView toggle active" href="#">Grid</a> 
    <a id="listView" class="btnListView toggle" href="#">List</a>   
  </div>

CSS 很长，但简而言之，有两个版本，一个是带有框和功能的网格视图，一个是直接列表视图。

4

1 回答 1

0

将此行添加到您的 document.ready： $("div#container").addClass("containerClass"); 不在单击事件中。

然后更换var thecontainer = $("div#container");

和var thecontainer = $(".containerClass");

于 2012-10-05T21:52:03.623 回答