Javascript 单击项目时在列表组和div之间切换

我有一个HTML页面，其中上半部分是静态的，下半部分是动态的。在该页面的移动视图中，下半部分是一个列表组，每个项目代表一个类别

---

单击任何项目时，我希望列表组消失，并且该类别的详细信息应显示在屏幕上。此外，上述静态部分不应受到影响。如何实现这一点？

您可以使用ui路由器和多命名视图或嵌套视图轻松实现：

在HTML中

<div class="row">
    <div class="col-sm-9">
        <div ui-view="columnOne"></div>
    </div>
    <div class="col-sm-3">
        <div ui-view="columnTwo"></div>
    </div>
</div>

在您的输入中

<a ui-sref="the_state" class="list-group-item list-group-nav-item">Category 1</a>

1类

有要显示的代码吗？请发布您到目前为止所做的代码。没有，没有。我只有基本列表组代码：

<a ui-sref="the_state" class="list-group-item list-group-nav-item">Category 1</a>