Question

有沒有辦法讓jQuery Mobile將JavaScript生成的鏈接渲染爲按鈕小部件，就像它在加載頁面時自動執行的一樣？

我有這樣的JavaScript來創建動態鏈接：

var ws=document.getElementById('workspace'); // empty <div id="workspace"></div> 
ws.innerHTML='<a id="myb" href="foo.php" data-role="button">baz</a>'; 

當然，這只是產生的，而不是一個按鈕，一個正常環節，所以我的問題是如何使jQueryMobile動態創建按鈕，因爲如果從一開始就在頁面中出現相同的<a id="myb" href="foo.php" data-role="button">baz</a>，它會這樣做？

編輯：

像這樣的腳本：

$('#tagspace').html('<a id="myb" data-inline="true" data-ajax="false" 
        href="boo.php" data-role="button">baz</a>') 
       .button() 
       .click(function() { window.location.href=this.href;}); 

是一種進步。它確實是導致一個按鈕（整頁寬度），並且對標籤文本之外的點擊很敏感。但是，this似乎未映射到包含預期鏈接「目標」的元素。

這樣做的結果DOM：

<div aria-disabled="false" class="ui-btn ui-shadow ui-btn-corner-all ui-fullsize 
             ui-btn-block ui-btn-up-c" data-mini="false" data-inline="false" data-theme="c" data-iconpos="" data-icon="" data-wrapperels="span" data-iconshadow="true" data-shadow="true" data-corners="true"> <span class="ui-btn-inner ui-btn-corner-all"> 
     <span class="ui-btn-text">baz</span> 
</span> 
    <div aria-disabled="false" class="ui-btn-hidden" id="tagspace"> <a id="myb" data-inline="true" data-ajax="false" href="boo.php" data-role="button">baz</a> 

    </div> 
</div> 

所以，它仍然不是同一種按鈕。

Answer 1

您可以通過將您的元素包裝到jQuery對象中並調用button()方法來創建按鈕構件。

$("#workspace").html("<a id='myb' href='foo.php' data-role='button'>baz</a>") 
       .button(); 

更新： Button控件阻止鏈接的默認行爲，所以你必須添加一個click處理程序，如果你想要的行爲回來：

$("#workspace").html("<a id='myb' href='foo.php' data-role='button'>baz</a>") 
       .button() 
       .click(function() { 
        window.location.href = this.href; 
       });