问题
I would like to add an another icon near by the plus icon of the jquery mobile collapsible list. But could not able to add it since jquery mobile creates that icon dynamically. Any suggestion would be greatly appreciated!
回答1:
This is certainly a hack but you can wait for the page to initialize, then find the list-view widget and append the jQuery Mobile HTML for an icon to each list-item:
//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;"> </span>');
});
Notice I changed the right
CSS property of the new icon so it doesn't overlap the initial icon.
Here is a demo: http://jsfiddle.net/uZxXB/
回答2:
<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;"> </span>Header</h1>
You can add it in html
Two icons one in the left and other for the right and change css of jQuery min to text align center
.ui-collapsible-heading .ui-btn{text-align:center;margin:0;border-left-width:0;
来源:https://stackoverflow.com/questions/10302769/how-to-add-multiple-icons-in-jquery-mobile-collapsible-list