如何在jQuery移动可折叠列表中添加多个图标

我想添加另一个图标附近的jquery移动可折叠列表的加号图标。但无法添加它，因为jquery mobile动态创建该图标。任何建议将不胜感激！如何在jQuery移动可折叠列表中添加多个图标

2012-04-24 Chillbird

另一种选择是将图像添加到标题中，如[本问题]中所述（http://stackoverflow.com/questions/6144503/add-image-to-collapsable-content-header）。 – 2013-09-12 20:54:58

这当然是一个黑客，但你可以等待页面初始化，然后找到列表视图控件并追加jQuery Mobile的HTML为每个列表项的图标：

//wait for a certain pseudo-page to initialize 
$(document).delegate('#home', 'pageinit', function() { 

    //find the listview and append to it's second tier children (the `<div class="ui-btn-inner ui-li" />` element) 
    $(this).find('ul[data-role="listview"]').children().children().append('<span class="ui-icon ui-icon-home ui-icon-shadow" style="right:30px;">&nbsp;</span>'); 
});

通知我更改了新图标的right CSS属性，因此它不会与初始图标重叠。

这里是一个演示：http://jsfiddle.net/uZxXB/

来源

2012-04-24 19:33:33 Jasper

非常感谢jasper！我开始实施的一段时间。这在List中效果很好，但是当涉及到Collapsible列表时，我以自己的方式实现，但是我得到的问题是当您在可折叠标题中单击时，这两个图标都变为负号。看到这段代码http://jsfiddle.net/uZxXB/ – Chillbird 2012-09-05 10:10:04

对不起，我发送了错误的链接，在这里你去[链接]（http://jsfiddle.net/chillbird/uZxXB/145/） – Chillbird 2012-09-05 10:23:48

@Chillbird如果你让一个的图标不是加号/减号图标，那么点击时不会改变：http://jsfiddle.net/uZxXB/146/。如果您真的需要这些图标中的一个，那么通过复制原件的CSS并为选择器添加后缀或前缀来创建它们的自定义版本。 – Jasper 2012-09-05 16:04:28

<fieldset data-role="collapsible" data-iconpos="left" > 
         <h1 ><span class="ui-icon ui-icon-home ui-icon-shadow ui-btn-icon-right" style="right:30px;">&nbsp;</span>Header</h1>

您可以在HTML中添加它

两个图标一个在左边和其他的jQuery的分权和改变CSS文本对齐中心

.ui-collapsible-heading .ui-btn{text-align:center;margin:0;border-left-width:0;

来源

2015-03-27 04:57:22

如何在jQuery移动可折叠列表中添加多个图标

回答

相关问题