Question

我以编程方式创建了弹出窗口，可折叠和listview在弹出窗口的内容中

通过使用$.map加载我的数据

动态创建

collapsible和listview

这是我的jsFiddle

我只是想知道它有没有办法限制列表视图中显示的<li>的数量？

例如

<ul>
   <li>1</li>
   <li>2</li>
   <li>3</li>
   <li>4</li>
   <li>5</li>
</ul>

我只想让它显示4 <li>，然后通过滚动<li>显示第五个<ul>

我该怎样做才能实现它？！

我试图设置<ul>的高度，但它不起作用......

抱歉我的英语不好......我是台湾人

如果你不明白我想说的话，请告诉我

我会尝试更好地解释

Answer 1

通过解决方案更新了您的小提琴： http://jsfiddle.net/ezanker/CnSMr/2/

基本上，我为你的可折叠div（.popupcollapsediv）指定了一个课程，然后将你的UL放入潜水班.ulcontainerdiv。

    $.map(kennedy.webdb.userdata[0].Category, function (value, key) {
    return $("<div/>", {
        id: value.Name,
        "data-role": "collapsible",
        "data-inset": "false",
        class: "popupcollapsediv"
    }).append(
      $("<h2/>", {
          text: value.Name
      })).append(
        $("<div/>", {
          class: "ulcontainerdiv"
        }).append(
          $("<ul/>", {
            "data-role": "listview",
            "data-icon": "false"
          }).append(
    ...

然后我使用CSS设置包含每个UL的div的最大高度，同时允许滚动，如果包含的UL高于最大高度;并从可折叠的。（/ p>）创建的自动生成的div中删除填充

.ulcontainerdiv{
    max-height: 170px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}
.popupcollapsediv .ui-body-a {
    padding: 0;
    margin: 0;
}

Answer 2

由于jQuery.map将数组的值和索引都发送给回调函数，为什么不在回调中包含一些内容，如下所示：

$.map( array, function ( value, index ) {
  // Make li here
  if ( index >= 4 ) {
    // Hide li here however you want, maybe just use .hide
  }
});

Jquery Mobile如何设置在可折叠集中的Listview的高度

2 个答案: