jQuery的移动创建动态controlgroup和应用jQuery的UI CSS [复制](jqu

这个问题已经在这里有一个答案：

• 动态controlgroup和复选框无样式 6个回答

这是我的代码： http://jsfiddle.net/YKvR3/34/

我将创建与在我的数组（名称）值controlgroup。 问题是，当我点击Load按钮在controlgroup添加值，但jQuery的UI风格不加载类的形象。 该controlgroup不使用jQuery UI的移动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();});​

我做错了吗？ 谢谢。

Answer 1:

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

来源： JQM文档

如果你通过Ajax生成的内容的新标记的客户端或负载，并将其注入到一个页面，你可以触发创建事件来处理自动初始化为包含新的标记内的所有插件。 这可以在任何元素（甚至在网页的div本身）上被触发，节省您的手动初始化每个插件（列表视图按钮，选择等）的任务。

Answer 2:

我做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可以趋向于螺杆输出，如果他们是不一样的： - ]

小提琴

Answer 3:

为了代替你应该使用内容.html(); 而不是.append()它增加了现有后的新内容。 将内容添加到一个jQuery移动页后需要增强内容，使用例如$("input[type='radio']").checkboxradio();

Answer 4:

我用

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" );

文章来源: jquery-mobile create dynamic controlgroup and apply jquery-ui css [duplicate]