7

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

我将使用我的数组（名称）中的值创建一个控制组。问题是，当我单击加载按钮时，值会添加到控件组中，但 jquery-ui 样式并未像图像中那样加载。控制组未使用 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();});​

在此处输入图像描述 我做错了什么？谢谢。

4

4 回答 4

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

来自：jqm 文档

如果您生成新的标记客户端或通过 Ajax 加载内容并将其注入页面，您可以触发 create 事件来处理新标记中包含的所有插件的自动初始化。这可以在任何元素（甚至是页面 div 本身）上触发，从而为您节省手动初始化每个插件（listview 按钮、选择等）的任务。

于 2012-11-28T08:16:17.427 回答
4

如果这篇文章太旧并且我的帖子不符合正确的标准，我会申请，因为这是第一次发帖，所以如果它非常糟糕，请纠正我:-]

但万一其他人遇到它，我在动态数据的显示方式上遇到了类似的问题，我使用上面的 jsfiddles 和评论作为帮助，这就是我的工作，离我的解决方案有点接近，我不' t 有一个按钮来加载页面加载时自动加载的数据。

在我的 .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 字符串正确时会更容易一些。

更新为了拥有圆角并将其作为一个控制组，您必须采用这种方法。就像以前的海报显示的那样。请注意，带有复选框的id和标签 for=如果它们不一样，可能会导致输出错误:-]

小提琴

于 2013-07-08T14:34:50.610 回答
1

为了替换您应该使用的内容，.html();而不是.append()在现有内容之后添加新内容。将内容添加到 jQuery Mobile 页面后，您需要增强内容，例如使用$("input[type='radio']").checkboxradio();

于 2012-11-27T17:02:47.417 回答
0

我正在使用

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-13T17:27:16.573 回答