个人中心
文章发布
退出
作者热门文章
- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库？
- java - OnItemClickListener 不起作用，但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
24
4
我认为这可能与我的代码或 css 有关，但我可以在 JSFiddle 中重现它:
<body>
<div data-role="page" id="index">
<div style="padding:20px">
<div>Here's the problem - this dynamicaly populated collapsable set should have rounded corners:</div>
<div id="output" data-role="collapsible-set" data-inset="true" data-theme="c"></div>
<div>If I use the same content but do not render it dynamically, it is fine:</div>
<div id="static" data-role="collapsible-set" data-inset="true" data-theme="c">
<div data-role="collapsible">
<h2>Container 1</h2>
<ul data-role="listview" data-filter="true" data-filter-theme="c" data-divider-theme="d"></ul>
</div>
<div data-role="collapsible">
<h2>Container 2</h2>
<ul data-role="listview" data-filter="true" data-filter-theme="c" data-divider-theme="d" start="" id="category-0" end="">
<li><a onclick="email_choose_template.selectTemplate(0)" href="javascript:void(0)" style="padding-left:62px"><img src="../../images/email_icon.png" style="width:40px; height:42px; float:left; margin-left:10px; margin-top:4px; "><h3 style="font-size:12px;">Template 1</h3></a>
</li>
<li><a onclick="email_choose_template.selectTemplate(1)" href="javascript:void(0)" style="padding-left:62px"><img src="../../images/email_icon.png" style="width:40px; height:42px; float:left; margin-left:10px; margin-top:4px; "><h3 style="font-size:12px;">Template 2</h3></a>
</li>
</div>
<div>Why the difference?</div>
</div>
</body>
<script>
$('#output').append('<div data-role="collapsible"><h2>Container 1</h2><ul data-role="listview" data-filter="true" data-filter-theme="c" data-divider-theme="d"></ul></div><div data-role="collapsible"><h2>Container 2</h2><ul data-role="listview" data-filter="true" data-filter-theme="c" data-divider-theme="d" start="" id="category-0" end=""><li><a onclick="email_choose_template.selectTemplate(0)" href="javascript:void(0)" style="padding-left:62px"><img src="../../images/email_icon.png" style="width:40px; height:42px; float:left; margin-left:10px; margin-top:4px; "><h3 style="font-size:12px;">Template 1</h3></a></li><li><a onclick="email_choose_template.selectTemplate(1)" href="javascript:void(0)" style="padding-left:62px"><img src="../../images/email_icon.png" style="width:40px; height:42px; float:left; margin-left:10px; margin-top:4px; "><h3 style="font-size:12px;">Template 2</h3></a></li>');
$('#output').trigger('create');
</script>
每当我在可折叠集上运行 trigger('create') 时，它似乎无法标记需要圆角的第一个 child 和最后一个 child 。
有什么想法吗？我的想法已经用完了，除了在渲染后自己手动应用类之外......
最佳答案
工作示例:http://jsfiddle.net/Gajotres/2QMk6/
只有当它们是可折叠集合的一部分时，可折叠才会有圆形边框。所以当动态创建2个collapsibleless时你还需要动态创建一个collapsible set。没有它，jQuery Mobile 将创建 2 个基本的可折叠对象，将它们放在可折叠集合中并不重要。
$('#output').after('<div id="new-collapsible-set" data-role="collapsible-set" data-inset="true" data-theme="c"><div data-role="collapsible"><h2>Container 1</h2><ul data-role="listview" data-filter="true" data-filter-theme="c" data-divider-theme="d"></ul></div><div data-role="collapsible"><h2>Container 2</h2><ul data-role="listview" data-filter="true" data-filter-theme="c" data-divider-theme="d" start="" id="category-0" end=""><li><a onclick="email_choose_template.selectTemplate(0)" href="javascript:void(0)" style="padding-left:62px"><img src="../../images/email_icon.png" style="width:40px; height:42px; float:left; margin-left:10px; margin-top:4px; "><h3 style="font-size:12px;">Template 1</h3></a></li><li><a onclick="email_choose_template.selectTemplate(1)" href="javascript:void(0)" style="padding-left:62px"><img src="../../images/email_icon.png" style="width:40px; height:42px; float:left; margin-left:10px; margin-top:4px; "><h3 style="font-size:12px;">Template 2</h3></a></li></div></div>');
$('#index').trigger('create');
<body>
<div data-role="page" id="index">
<div data-role="content">
<div style="padding:20px">
<div>Here's the problem - this dynamicaly populated collapsable set should have rounded corners:</div>
</div>
<div id="output">If I use the same content but do not render it dynamically, it is fine:</div>
<div id="static" data-role="collapsible-set" data-inset="true" data-theme="c">
<div data-role="collapsible">
<h2>Container 1</h2>
<ul data-role="listview" data-filter="true" data-filter-theme="c" data-divider-theme="d"></ul>
</div>
<div data-role="collapsible">
<h2>Container 2</h2>
<ul data-role="listview" data-filter="true" data-filter-theme="c" data-divider-theme="d" start="" id="category-0" end="">
<li>
<a onclick="email_choose_template.selectTemplate(0)" href="javascript:void(0)" style="padding-left:62px">
<img src="../../images/email_icon.png" style="width:40px; height:42px; float:left; margin-left:10px; margin-top:4px; "/>
<h3 style="font-size:12px;">Template 1</h3>
</a>
</li>
<li>
<a onclick="email_choose_template.selectTemplate(1)" href="javascript:void(0)" style="padding-left:62px">
<img src="../../images/email_icon.png" style="width:40px; height:42px; float:left; margin-left:10px; margin-top:4px; "/>
<h3 style="font-size:12px;">Template 2</h3>
</a>
</li>
</ul>
</div>
<div>Why the difference?</div>
</div>
</div>
</div>
</body>
关于JQuery Mobile 动态填充的可折叠集丢失圆角，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16741048/
24
4
0
我正在尝试创建一个无序列表，其中每个 包含另一个无序列表。我想要触发子菜单向下滑动的列表项有类 mobile-collapse子菜单有类 mobile-drop-menu 。这是我的 jquery 代
我使用 PMD检查我的代码。在大多数情况下，它给了我非常有用的提示，但我无法弄清楚在以下情况下可以改进什么。 原始代码如下所示: if ((getSomething() != null && getS
需要一些 jquery/js/jsp 功能的帮助.. 我有一个可折叠的表格脚本: (function($){ $.fn.extend({ setupCollapstable: funct
我使用 CSS 和 Javascript 创建了一个 Accordion ，但我不知道如何在选择不同的 Accordion 后折叠打开的 Accordion 。我试过在 Javascript 中使用可
我使用 CSS 和 JS 编写了一个可折叠按钮，我想将一个按钮嵌套在另一个按钮中。 是否可以动态调整第一个/外部按钮的高度，以便在打开第二个/内部按钮时，第一个按钮的高度增加第二个按钮的高度？ 这是我
我正在使用 jQuery 创建一个导航系统。我想要实现的是在页面加载时显示父元素并隐藏子元素。我做得非常简单。 然而，当我在其他父元素之间切换时，我希望能够隐藏之前的子元素，以便我只能打开一个 一次。
我正在尝试匹配这个设计 点击卡片应该展开 我不能用卡片包裹扩展 block ，因为扩展 block 基本上只有一行，我试着按照这个例子 flutter_catalog 我在谷歌上搜索了很多，但找不到我
我正在尝试切换 div 以使其可见/隐藏。我正在制作一个排行榜，我想打开它，但只能在单击时打开。 test fu
我正在使用 Materialize CSS 并使用可折叠的 Accordion 式元素 ( http://materializecss.com/collapsible.html )。 出于某种原因，当
我有一个递归 TreeView ，它从数据库中提取所有信息，并且想了解如何使其可折叠。我尝试使用 Jquery 和 Javascript，但都没有任何效果。不确定是我的错误还是其他原因。 这是我的基本
我收到异常“可折叠 if 语句”。 通过以下代码中的 Sonar 。 if(getSomething().equals(getSomething()){ if(getsomehing.contai
我正在制作 Accordion 以在 Angular 应用程序中使用 javascript 制作可折叠的 div.. 为此，如果单击Parent One 或任何其他父名称上的按钮未打开它.. HTML
我正在将 Ant Design 与 React 一起使用。 Ant Design 有一个菜单组件:https://ant.design/components/menu/ 是否可以使菜单不可折叠/展开？
我想展示这个可折叠 Accordion 的第一个元素。我在互联网上做了一些研究，但徒劳无功 Aller au dossier personnel
考虑以下 foldMap 的签名 foldMap :: (Foldable t, Monoid m) => (a -> m) -> t a -> m 这与“绑定(bind)”非常相似，只是交换了参数:
使用“fieldsets”，您可以通过指定 CSS 类“collapse”使其可折叠。如何对“内联”做同样的事情？谢谢! 最佳答案 在 Django 1.10+ 中: class MyModelInl
有人已经用 YUI dataTable 制作了如下示例的脚本吗？ 示例: http://extjs.com/deploy/dev/examples/tree/column-tree.html http
好吧，有些事情很奇怪，我无法弄清楚。假设我有一些类别，每个类别都有一些项目，全部放入字典中。 import wx nyoom = {} nyoom['spiders'] = ['Yellow Sac'
我正在尝试实现一种可折叠的 StackLayout。每次用户单击按钮时，它都会展开或折叠堆栈布局以显示/隐藏更多详细信息。 我能够通过下面的代码实现更多/更少的效果，但它看起来不对而且效果也不是很好，
我的布局包含顶部的水平 recyclerView 和 viewPager。 ViewPager 在其每个选项卡中都有一个 recyclerView。 我想在用户滚动布局时折叠顶部水平回收器 View
我是一名优秀的程序员,十分优秀！