jQuery的移動創建動態controlgroup和應用jQuery的UI CSS

這是我的代碼： http://jsfiddle.net/YKvR3/34/jQuery的移動創建動態controlgroup和應用jQuery的UI CSS

我將創建與在我的數組（名稱）值controlgroup。問題是，當我點擊加載按鈕的值添加到控制組中，但jquery-UI樣式不會像圖像中加載。控制組沒有使用jquery-ui mobile css樣式。

$("#load").click(function(){ 
var name=["one","two"]; 
var html='<fieldset id="listPlayers" data-role="controlgroup"><legend><h1>Choose as many players as youd like to remove:</h1></legend>'; 
for (var int = 0; int < 2; int++) { 
     html+='<input type="checkbox" name="checkbox-'+int+'a" id="checkbox-'+int+'a" class="custom" /><label for="checkbox-'+int+'a">'+name[int]+'</label>'; 
    } 
    alert('<legend><h3>Choose as many players as you would like to remove:</h3></legend>'+html+'</fieldset'); 
    $("#list").html(html+'</fieldset');  
//$("#list").page();});

enter image description here 我做錯了嗎？謝謝。

來源

2012-11-27 michele

$("#list").trigger('create');

來源：jqm docs

如果生成新的標記內容通過Ajax客戶端或負載並將其注入到頁面中，您可以觸發create事件來處理新標記中包含的所有插件的自動初始化。這可以觸發任何元素（甚至是頁面div本身），爲您節省手動初始化每個插件（列表視圖按鈕，選擇等）的任務。

來源

2012-11-28 08:16:17 grigno

謝謝http：// jsfiddle.net/YKvR3/36/ – michele

爲了替換內容，您應該使用.html();而不是.append()，它將新內容添加到現有內容之後。將內容添加到一個jQuery Mobile的頁面後，您需要加強的內容，例如使用$("input[type='radio']").checkboxradio();

來源

2012-11-27 17:02:47 Romain

問題沒有解決...... – michele

你的小提琴顯然有變化。你可以查看http://jsfiddle.net/wNxfJ/1/，它可以解釋你的問題的答案。 – Romain

這是一個解決方案，但你使用單選按鈕...我會使用控制組 – michele

我做applogies如果這個職位太舊，如果我的帖子是不是正確的標準，因爲這是有史以來第一次發佈，請糾正我，如果這是可怕的壞： - ]

但在在遇到其他人遇到它時，我遇到了類似的動態數據顯示問題，並且使用了上面提到的jsfiddles和註釋作爲幫助，這就是我的工作原理，有點接近我的解決方案，我沒有一個按鈕，用於加載頁面加載時自動加載的數據。

更新在我的.html文件：

<div id="members"></div>  
<input type="button" id="load" value="test"/>

更新在我的.js文件：

$("#load").click(function(){ 

var name = ["NameOne","NameTwo", "NameThree"]; 
var fset = '<fieldset data-role="controlgroup" id="members-ctrlgroup"><legend>This is a legend:</legend>'; 
var labels=''; 

    for (var i = 0; i < name.length; i++) { 

     labels += '<input type="checkbox" class="checkbox" id="c' 
       + i 
       + '"><label for="c' 
       + i 
       + '" data-iconpos="right">' 
       + name[i] 
       +'</label>'; 
    } 
    $("#members").html(fset+labels+'</fieldset>');  
    $("#members").trigger("create"); 
});

我知道了「場」看起來有點怪我怎麼將它分開，但我發現在這些情況下，要使整個html字符串正確無誤時，它更容易一些。

更新爲了有圓角，並把它作爲一個controlgroup你必須有這樣的一種辦法。就像前海報所示。請注意，ID與複選框和標籤=可以趨向於螺桿輸出，如果他們是不一樣的： - ]

fiddle

來源

2013-07-08 14:34:50 ervios

我用

for(var i=0 ; i < html.length ; i++){ 

         var spline = html[i].split("|"); 

         inHTML = inHTML + " <input type=\"checkbox\" name=\"checkbox-"+i+"a\" id=\"checkbox-"+i+"a\" class=\"custom\" /> <label for=\"checkbox-"+i+"a\">"+ spline[0] +" , "+ spline[2] +"</label> "; 


        } 

        jq("fieldset#myFieldSet").empty(); 
        jq("fieldset#myFieldSet") 
        // Append the new rows to the body 
        .append(inHTML) 
        // Call the refresh method 
        .closest("fieldset#myFieldSet") 

        // Trigger if the new injected markup contain links or buttons that need to be enhanced 
        .trigger("create");

來源

2014-06-13 17:27:16 serginhofogo

jQuery的移動創建動態controlgroup和應用jQuery的UI CSS

回答

相關問題