在listview裏面重疊li

我在listview中動態生成列表項（onclick）。您可以查看我的代碼在這裏： jsfiddle 在listview裏面重疊li

因爲我要陪與代碼的jsfiddle鏈接，這裏有雲：

HTML

<div data-role="fieldcontain">Select option: 
    <br> 
    <select name="prodselect" id="prodselect"> 
     <option data-foo="xxx">first</option> 
     <option data-foo="yyy" selected="selected">Second</option> 
    </select> 
    <input type="button" name="appeprod" id="appeprod" value="Add option" data-icon="add" data-inline="true" /> 
</div> 
<ul name="listaproduse" id="listaproduse" data-role="listview" data-theme="c" data-divider-theme="e" data-count-theme="b" data-inset="true"> 
    <li data-role="list-divider"> 
     <h3 class="ui-li-heading">Selected options</h3> 
<span class="ui-li-count">5</span> 
    </li> 
    <li id="produsele" name="produsele"></li> 
</ul>

和JScript

$('#appeprod').click(function() { 
    var option = $('#prodselect').val(); 
    var box = document.getElementById('prodselect'); 
    var option2 = box.options[box.selectedIndex].text; 
    $('#listaproduse').append('<li><h3>'+option2+'<h3><p>'+option+'</p><p>Some comment:</p></li>'); 
    $('#listaproduse').listview("refresh"); 
});

我的問題是（正如你可以看到它在jsfiddle中）H3標籤內容與下面的段落重疊。

我更新了jsfiddle，在動態列表視圖下面添加了一個靜態列表，它具有與我希望在動態列表中生成的內容相同的內容。靜態的看起來很好，而動態的則重疊。我能做什麼？我該如何避免這種情況？

來源

2013-07-10 user1137313

您沒有在您的JS代碼中正確關閉<h3>。應該是：<h3>'+option2+'</h3>

來源

2013-07-10 23:30:04 antishok

哇.. **我是**厭倦畢竟......你是對的上邊距爲-0.5em 。結束標籤中缺少/就做了它。改變和工作的代碼是[jsfiddle]（http://jsfiddle.net/r3Zcj/18/）（我只是喜歡找到代碼，當我正在尋找的東西，所以至少我可以做的是爲此貢獻與其他初學者喜歡我）。再次感謝。 – user1137313

您需要將此添加到樣式中。我看着加入到該元素的造型，發現

CSS

.ui-li-desc 
{ 
margin-top: 0; 
}

來源

2013-07-10 23:37:28 clurect

在listview裏面重疊li

回答

相關問題