如何在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移動可摺疊列表中添加多個圖標

回答

相關問題