文章/答案/技术大牛

发布

社区首页 >问答首页 >可折叠内容框无法工作

问可折叠内容框无法工作
EN

Stack Overflow用户

提问于 2015-04-26 15:32:58

回答 1查看 638关注 0票数 0

我一直在寻找一个解决方案，包括这里的许多关于Stackoverflow的解决方案，但仍然无法使它发挥作用，因此出现了这个问题。

其目的是将可折叠的内容框放置在简单的html页面中。在查看了几个演示之后，我觉得以下内容看起来最好而且安装起来也很容易(脚本已经托管了，只需要处理html)：sets

我在脑子里贴了以下几个字：

<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script> <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

省略了元名称和链接rel，因为如果包含它们，页面的格式就会混乱(一些标题文本变得粗体，按钮不对齐)。

以下内容放置在页面上所需的位置：

<div data-role="page" id="pageone">
  <div data-role="header">
    <h1>Collapsible Sets</h1>
  </div>

...

<div data-role="footer">
    <h1>Insert Footer Text Here</h1>
</div>
    </div>

但是，当我在Firefox中查看页面时，隐藏功能不起作用；所有内容都显示出来了。有人能告诉我吗？

谢谢你安迪。我设法让它在某种程度上起作用，但发现它把我的字体和东西搞砸了。从头部移除这条线

      <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">

修复它，但呈现可折叠集破坏。我不相信他们会期望人们把他们的代码放到一个不使用CSS的网站上，而且很明显，我不会抛弃我的代码并使用他们的代码，那么我如何才能让这个链接的CSS与我现有的CSS很好地结合呢？

另外，我还试图在集合中嵌入一个Jotform代码。然而，即使我已经将代码粘贴到内部(尝试了embed，iframe，source)，但在扩展面板中什么也没有显示出来。帮助?

html

html.dropdownlistfor

回答 1

Stack Overflow用户

发布于 2015-04-26 18:21:07

我也一直在学习Jquery。

您的标题需要以下几个基本功能才能使其正常工作:-

<!DOCTYPE html>

<html lang="en">

<head>
<title>my test</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>

现在，在你的身体内，试着在页面体中粘贴以下内容：-

  <div data-role="main" class="ui-content">
<div data-role="collapsibleset">
  <div data-role="collapsible">
    <h3>Click me - I'm collapsible!</h3>
    <p>I'm the expanded content.</p>
  </div>
  <div data-role="collapsible">
    <h3>Click me - I'm collapsible!</h3>
    <p>I'm the expanded content.</p>
  </div>
  <div data-role="collapsible">
    <h3>Click me - I'm collapsible!</h3>
    <p>I'm the expanded content.</p>
  </div>
  <div data-role="collapsible">
    <h3>Click me - I'm collapsible!</h3>
    <p>I'm the expanded content.</p>
  </div>
</div>

我强烈建议在Jquery站点http://jquerymobile.com/上花点时间

可折叠集小部件直接链接在这里，http://api.jquerymobile.com/collapsibleset/。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/29879624

复制

相似问题

问可折叠内容框无法工作
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问可折叠内容框无法工作EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问可折叠内容框无法工作
EN