创建使用jQuery Mobile一个ListView无法正常工作

问题描述：

使用JQuery的移动欲的UL-的ListView添加到窗口经由JScript的动态创建它，有一个问题。

Using JQuery mobile I want to add a ul-ListView to a window dynamically creating it via JScript, there is a problem.

当我加固定的HTML ListView中，一切工作正常。该定义看起来像

When I add the ListView fixed to HTML, everything works fine. The definition looks like

    ...            
        <div data-role=content>
             <ul id='listviewAktuelleChecklist' data-role=listview data-theme="d" data-divider-theme="d" data-inset=true>
                <li id="listDividerAktuelleChecklist" data-role=list-divider>yyy Checklist</li>
                <li id='LoadChecklist'> <a> Checkliste von Market-Value laden </a></li>
            </ul>
        </div>
   ...

和在Firefox中显示当其预期什么。但是，当我通过JScript中创建它，它看起来就像是：

and when showing in Firefox its just what was expected. But when I create it by JScript, it looks like that:

（对不起你们，我不能在这里添加图片由于缺少引用，所以继承人的链接图片：
http://www.market-value.de/downloads/ul.jpg

(sorry guys, I'm not allowed to add a picture here due to missing references, so heres a link to the picture: http://www.market-value.de/downloads/ul.jpg

顶部的ListView是我通过HTML定义得到，下面生成什么确定按钮（对于那些谁不查看图片：生成Listviw显示只是作为一个普通的HTMLUL用子弹。 ..）

The top ListView is what I get via the HTML definition, below the "OK" button what was generated (for those who don't view the picture: the generated Listviw shows just as a normal HTML "ul" with bullets...)

我用code：

$("#BTN1").bind  ("click", function (event)
{
 var html = "";
 html += "<ul id='ChecklistListea' data-role=listview data-theme='d' data-divider-theme='d' data-inset=true>"
 html += '<li id="listDividerAktuelleChecklista" data-role=list-divider>yyy Checklist</li>'
 html +=   "<li id='LoadChecklista'> <a> Checkliste laden </a></li>";
 html += "</ul>";
 $(html).appendTo('#DivChecklistListe');

    $("#ChecklistListe").listview("refresh");

});

我试图创建动态HMTL一些不同的方法，但结果却总是相同的。

I tried some different methods for creating the dynamic HMTL, but the result was always the same.

有谁知道，到底是怎么回事错在这里？

Does anyone knows, what is going wrong here?

PS：如果我在HMTL直接定义ListView和只添加ListItems的一切工作正常。

ps: if I define the ListView in HMTL directly and only add the ListItems everything works fine!

答

首先，你正在呼吁一个错误的ID刷新，但即使是在一个正确的ID，这将无法正常工作的情况下，。这是因为你从头创建一个列表视图，ul元素与内里的元素。

First you are calling refresh on a wrong id, but even in case of a correct id this will not work. This is because you are creating a listview from scratch, ul element with inner li elements.

在此情况下，它是不够的调用列表视图（刷新），因为列表视图必须首先进行初始化，然后才能被刷新。

In this case it is not enough to call listview('refresh') because listview first must be initialized before it can be refreshed.

它可以这样做：

$("#ChecklistListea").listview().listview("refresh");

首先 .listview（） 的通话将初始化一个ListView和第二个将样式。

First .listview() call will initialize a listview and second one will style it.

的例子： http://jsfiddle.net/Gajotres/4HRNK/

创建使用jQuery Mobile一个ListView无法正常工作

相关推荐