Question

我想使用JQuery Mobile创建一个webradio站列表。列表的某些部分（如电台名称和类型标签）应该是永久可见的，而其他部分（如网址或评论）应该折叠，并且只能按需取消。

为了澄清我的要求我做了一个例子：

<div data-role="content">
    <ul data-role="listview">
        <li>
            <h2>Item 1</h2>
            <div class="tag-list">
                <span class="tag">Tag A</span>
            </div>
            <div class="comment-list">
                <div class="comment">
                    <p>This is a comment</p>
                </div>
                <div class="comment">
                    <p>Another comment</p>
                </div>
            </div>
        </li>
    </ul>
</div>

（在这里更好看：http://jsfiddle.net/uAvpS/1/）

只应展开comment-list和comment，其余部分应始终可见。

如何实现这一目标？在我看来，这与collapsible lists

不同

Answer 1

为每个li提供data-role="collapsible"并在其标题内，添加包含标记的自定义span。

Demo

<li data-role="collapsible">
  <h2>Item 1<span class="tag-list"><span class="tag">tag 1</span></span></h2>
  <div class="comment">
    <p>This is a comment</p>
  </div>
  <div class="comment">
    <p>Another comment</p>
  </div>
</li>

折叠列表中的部分项目

1 个答案: