【问题标题】: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 有效,我的意思是不要在标题中链接主题样式并查看结果。希望它有效。谢谢

    【讨论】:

      猜你喜欢
      • 2014-03-20
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-09-12
      • 2013-06-12
      • 1970-01-01
      相关资源
      最近更新 更多