JQuery Mobile未應用

Question

我在使用JQueryMobile時遇到了一些麻煩，因爲我想實現一些小部件，但小部件的主題和顏色沒有很好地實現。

這裏有一張照片顯示發生的事情：

再舉例來說，正確的部件將是：

如果我添加動態的jquerymobile部件則主題不是很好添加，但如果HTML已經在文件（不是動態添加JavaScript）主題看起來不錯。這裏是我用來添加小部件的代碼：

function cesta_insert_html(){ 
    var cesta_bought = $('body').data('cesta_list'); 
    cesta_bought.forEach(function(element, index){ 
     image = get_product_info(element[0].id, 'data' + $('body').data('clicked_listview_item')); 
     $('#cesta_view').append('<div data-role="collapsible-set" id="collapsible" data-theme="a" data-content-theme="c"><div data-role="collapsible" data-collapsed="false"><h3 id="title_collapsible">'+image.pname+'</h3><center><div id=image_cesta><img src=data:imajpeg;base64,'+image.pimage+' alt="image"></div><div data-role="fieldcontain"><fieldset data-role="controlgroup"><input type="range" class="slider" name="slider" value="0" min="0" max="100" data-highlight="false"></fieldset></div></center><div class="ui-grid-a"><div class="ui-block-a"><a id=SaveChangesCesta data-role="button" type="submit" >Guardar cambios</a></div><div class="ui-block-b"><a id="DeleteCesta" type="submit" >Eliminar de cesta</a></div></div></div></div><br><br>'); 
    }); 
} 

謝謝！

Answer 1

工作例如：http://jsfiddle.net/Gajotres/6nG2n/

要結合使用多種不同的部件，以提高他們的標記，你應該運行的觸發（「創建」）。

瞭解更多關於它在我的其他答案：jQuery Mobile: Markup Enhancement of dynamically added content

$('[data-role="content"]').append('<div data-role="collapsible-set" id="collapsible" data-theme="a" data-content-theme="c"><div data-role="collapsible" data-collapsed="false"><h3 id="title_collapsible">Image</h3><center><div id=image_cesta><img src=data:imajpeg;base64,Image alt="image"></div><div data-role="fieldcontain"><fieldset data-role="controlgroup"><input type="range" class="slider" name="slider" value="0" min="0" max="100" data-highlight="false"></fieldset></div></center><div class="ui-grid-a"><div class="ui-block-a"><a id=SaveChangesCesta data-role="button" type="submit" >Guardar cambios</a></div><div class="ui-block-b"><a id="DeleteCesta" type="submit" >Eliminar de cesta</a></div></div></div></div><br><br>'); 
$('#index').trigger('create'); 

Answer 2

檢查這些類似的問題了：jQuery Mobile creating a Collapsible set dynamically via ajax does not apply styling Dynamically adding collapsible elements Dynamically adding collapsible elements

在jQuery Mobile的動態添加的東西后，你可以通過調用創建或刷新方法應用於標記。

嘗試調用

$("collapsible").collapsible() 

附加可摺疊的初始化之後。