在 JQuery Mobile 中，data-mini 在可折叠集合中不起作用答案

【问题标题】：In JQuery Mobile, data-mini doesn't work in collapsible set在 JQuery Mobile 中，data-mini 在可折叠集合中不起作用
【发布时间】：2014-10-28 00:44:10
【问题描述】：

我是 JQuery mobile 的新手程序员，我正在尝试做一个可以过滤的简单可折叠集合。过滤器看起来不错，但我无法让 data-mini 工作。想要的效果是拥有迷你版的可折叠套装。

<div data-role="collapsible-set" data-mini="true" data-filter="true" data-input="#filterable-input">         

      <div data-role="collapsible" data-filtertext="section1">
        <h3>Section 1</h3>
        <p>I'm the collapsibleset content for section 1. My content is initially visible.</p>
      </div>

      <div data-role="collapsible" data-filtertext="section2">
        <h3>Section 2</h3>
        <p>I'm the collapsibleset content for section 2.</p>
      </div>

</div>

这里是 JS Fiddle http://jsfiddle.net/g48uns3g/

提前致谢，加布里埃尔

【问题讨论】：

标签： jquery jquery-mobile

【解决方案1】：

我创建了一个示例来测试迷你和普通可折叠套装的外观。我的 HTML 代码可以在底部找到，但可以在这里找到一个 jsFiddle：

jsFiddle

当我将此（视觉上）与您的样本进行比较时，我似乎看到您的样本确实有效并且是“迷你”的，除非您将迷你与非迷你并排比较，否则很难判断.

<div class="ui-content">
     <h4>Normal</h4>
    <div data-role="collapsibleset" data-mini="false">
        <div data-role="collapsible">
            <h3>I'm a normal collapsible</h3>
            <p>This is good for tight spaces.</p>
        </div>
        <div data-role="collapsible">
            <h3>I'm another normal</h3>
            <p>Here's some collapsible content.</p>
        </div>
        <div data-role="collapsible">
            <h3>Last one</h3>
            <p>Final bit of collapsible content.</p>
        </div>
    </div>
    <h4>Mini</h4>
    <div data-role="collapsibleset" data-mini="true">
        <div data-role="collapsible">
            <h3>I'm a mini collapsible</h3>
            <p>This is good for tight spaces.</p>
        </div>
        <div data-role="collapsible">
            <h3>I'm another mini</h3>
            <p>Here's some collapsible content.</p>
        </div>
        <div data-role="collapsible">
            <h3>Last one</h3>
            <p>Final bit of collapsible content.</p>
        </div>
    </div>
</div>

【讨论】：

非常感谢这个例子！但是在我的电脑上还是不行...prntscr.com/50rhgp
嗯......嗯......你的屏幕截图确实看起来像“正常”大小而不是“迷你”。我们似乎有一个谜。我猜它在我发布的 jsFiddle 中看起来“迷你”。我想我们的下一步将是非常详细地查看您自己的 HTML、JavaScript 和 CSS。您可以将您正在使用的文件发布到我们可以查看的地方吗？

【解决方案2】：

我的应用程序中也存在这个问题很长一段时间。想了很多，我发现链接样式表存在冲突。如果您禁用了主题，data-mini true 有效，我的意思是不要在标题中链接主题样式并查看结果。希望它有效。谢谢

【讨论】：