JQueryMobile可摺疊不起作用

Question

我正在嘗試在JQM中使用可摺疊集。 當我寫：

<div id="content" data-role="main" class="ui-content" > 
    <div class="box" data-role="collapsible"> 
     <h3>lang</h3> 
     <p> lang = <input name="settings[lang]" value="en"></p> 
    </div> 
</div> 

它工作正常，但是當我嘗試建立它的jQuery它不建立一個可摺疊。 代碼如下：

function f() { 
    var str = '<div class="box" data-role="collapsible">' + 
      '<h3>lang</h3>' + 
      '<p> lang = <input name="settings[lang]" value="en">' + 
      '</p>' + 
      '</div>'; 
    $('#content').html(str); 
} 

有誰知道什麼是錯的代碼？

衝孔

Answer 1

確保爲了與其他的div有數據角色=「collapsibleset」來包裝可摺疊股利以後能夠刷新元素：

<div id="content" class="ui-content" data-role="collapsibleset"> 

</div> 

，然後調用。 collapsibleset（ '刷新'）動態插入您的可摺疊後：

function f() { 
    var str = '<div class="box" data-role="collapsible">' + 
      '<h3>lang</h3>' + 
      '<p> lang = <input name="settings[lang]" value="en">' + 
      '</p>' + 
      '</div>'; 
    $('#content').html(str); 
    $('#content').collapsibleset('refresh');    
} 

看到一個工作示例：http://jsbin.com/fixefumose/edit?html,js,output