2

我一直在尝试通过将 中的属性设置为 来从可折叠集中删除图标data-iconpos="none"divcollapsible-set没有运气。它会删除它,但仍会留下某种阴影。

在此处输入图像描述

4

9 回答 9

7

唯一的解决方案是使用 CSS,尝试向可折叠对象添加一个类,例如:class='listItemNoIcon'

在您的 HTML 文件中添加以下内容:

<div  class='listItemNoIcon' data-role='collapsible' data-collapsed='false'>
</div>

并将其添加到您的 css 文件中:

.listItemNoIcon .ui-icon
{

 display: none;

}
于 2012-11-12T11:43:18.900 回答
5

使用 jQuery Mobile 1.4.0,您还可以将data-collapsed-icondata-expanded-icon属性设置为false.

<div data-role="collapsible" data-collapsed-icon="false" data-expanded-icon="false" data-theme="a">
     <h2>My Account</h2>

    <ul class="ui-listview mainNav" data-role="listview" data-theme="a">
        <li data-icon="carat-r"> <a href="#">Manage Account</a>

        </li>
        <li data-icon="carat-r"> <a href="#">Edit Profile</a>

        </li>
        <li data-icon="carat-r"> <a href="#">Upload Profile Picture</a>

        </li>
    </ul>
</div>

jsFiddle

于 2014-01-20T14:52:46.877 回答
2

请注意,上述解决方案将隐藏可折叠字段集中的所有图标。

要确保只隐藏可折叠标题中的图标,请使用以下命令:

.ui-collapsible-heading .ui-icon {
    display: none;
}

由于 jquery mobile 将类“ui-collapsible-heading”添加到可折叠字段集中的标题中。

应该工作直到 jquery mobile 决定改变一些东西;)

于 2013-03-27T15:32:16.217 回答
1

使用 JQM 1.4.0rc1,这似乎仍然存在一些问题。我必须在我的 PageShow 事件中使用以下 Javascript 逻辑来完全隐藏图标:

$('#MyList').find('a.ui-collapsible-heading-toggle').each(function() {
    $(this).removeClass('ui-btn-icon-right');
});
于 2013-12-18T15:03:32.077 回答
0

最好的办法是不需要任何图标的 Li 元素,请执行以下操作

$(<your-li-elment>).find("span.ui-icon').remove()
于 2013-11-30T20:13:28.263 回答
0

以 Demnogonis 所写的内容为基础,data-collapsed-icon="noicon"并将data-expanded-icon="noicon"该类添加ui-nodisc-icon到可折叠的父级中,这对我有用。否则剩下一个空圆圈。

http://view.jquerymobile.com/master/demos/icons/ 搜索:取出光盘

使用 JQM 1.4.5

于 2016-02-18T12:02:11.620 回答
-1

给你的可折叠集一个 id 然后你可以做以下

#myId >.ui-icon
{

 display: none;

}

此 CSS 会查看可折叠集中所有具有 .ui-icon 类的元素,并将它们的显示设置为无

于 2013-03-27T18:00:14.427 回答
-1

您可以使用 CSS 或覆盖 JQM javascript。

  1. CSS

    .ui-collapsible-heading .ui-icon { 显示:无;}

  2. 覆盖此行的 JQM 搜索:collapsedIcon = $el.jqmData("collapsed-icon") || o.collapsedIcon || “加”; 替换为:collapsedIcon = ($el.jqmData("collapsed-icon") =="none")? 假:(o.collapsedIcon ||“加号”);

并在 html 中添加此属性 data-collapsed-icon="none" 如下所示

 <li data-role="collapsible" data-inset="false"  data-collapsed-icon="none" data-icon="false">
       <h3>Section 1</h3>
       <p>I'm the collapsible set content for section 1.</p>
 </li>  
于 2013-06-29T07:40:01.680 回答
-2

jQM 1.1.1 data-attribute reference提到 Collapsible 集的 data-iconpos 属性的可能值是:

离开 | 对 | 顶部 | 底部 | 正文

因此,也许唯一的解决方法是使用自定义 CSS 的解决方案。

于 2012-08-24T11:49:39.070 回答