使用javascript在div中添加div到phonegap

Question

我正在學習使用phonegap開發應用程序。我的問題是，在追加div的時候，它並不是應該顯示的。

這裏是我的代碼

<div data-role="content" id="contenido"> 
    <div data-role="collapsible-set" id="tareas"> 

    <div data-role="collapsible" id="tarea_1">'+ 
     '<h3>Tarea 1</h3>'+ 
     '<a class="ui-btn-a ui-btn ui-btn-icon-right ui-icon-carat-r" data-form="ui-btn-up-a" data-swatch="a" data-theme="a" href="#">Descripcion</a>  </div> 

    </div>    
</div> 

這種可摺疊的「tarea_1」的一部分，如果我將其添加到它會出現這樣的HTML。

但是，當我使用此代碼追加它：

$('#tareas').append('<div data-role="collapsible" id="tarea_1">'+ 
     '<h3>Tarea 1</h3>'+ 
     '<a class="ui-btn-a ui-btn ui-btn-icon-right ui-icon-carat-r" data-form="ui-btn-up-a" data-swatch="a" data-theme="a" href="#">Descripcion</a>   </div>').listview('refresh'); 

這是我得到

我認爲這是因爲刷新的，但我不知道如何解決它

Answer 1

您需要使用「.collapsibleset（'refresh'）;」而不是 「.listview（ '刷新'）」

見這個例子for Jquery Mobile

工作Plunkr

$('document').ready(function(){ 
    $('#tareas').append("<div data-role='collapsible' id='tarea1'><h3>Tarea 1</h3></div>").collapsibleset('refresh'); 
});