javascript-动态地将元素追加到列表中，但浏览器不'；刷新用户界面

我有一个JavaScript代码段用于加载服务器的数据项，并使用生成的LI元素将它们插入UL元素，如下所示：

function loadNewFileTemplates() { var list = _fileTemplateContainer.find("ul"); $.submitToServer("[server URL]", null, function (data) { list.empty(); if (data == "") { list.append("Templates not available."); // in sample code, removed HTML tags } else { $.each(data, function (index, item) { var itemElement = $("[HTML template string]"); itemElement.find("div[data-field='image']").css("background-image", "url(" + item.icon + ")"); itemElement.find("div[data-field='caption']").text(item.caption); itemElement.find("div[data-field='description']").text(item.description); itemElement.find("div[data-field='type']").text(item.type); itemElement.bind("click", function (e) { $(e.target).parents("ul").find("li").removeClass("projectSelected"); $(e.target).parents("li").addClass("projectSelected"); }); itemElement.appendTo(list); }); } console.log(list); }); } 函数loadNewFileTemplates（）{ var list=_fileTemplateContainer.find（“ul”）； $.submitToServer（“[server URL]”，null，函数（数据）{ list.empty（）； 如果（数据==“”）{ append（“模板不可用”）；//在示例代码中，删除了HTML标记 } 否则{ $。每个（数据、功能（索引、项目）{ var itemlelement=$（“[HTML模板字符串]”）； find（“div[data field='image']”）css（“background image”，“url”（+item.icon+））； find（“div[data field='caption']”）文本（item.caption）； itemElement.find（“div[data field='description']”）文本（item.description）； find（“div[data field='type']”）文本（item.type）； 绑定（“单击”，函数（e）{ $（e.target）.parents（“ul”）.find（“li”）.removeClass（“projectSelected”）； $（e.target）.parents（“li”）.addClass（“projectSelected”）； }); itemElement.appendTo（列表）； }); } 控制台日志（列表）； }); } 此代码在第一次加载时工作，但在第二次加载时，在将元素插入UL元素后，UI无法刷新

我确认数据已成功插入（使用console.log（）输出结果），因此无法找到有关此问题的原因

如何解决这个问题？ 谢谢

我的浏览器：Chrome 19.0.1084.56，IE 9.0.8112.16421

---

jQuery 1.5.1版

尝试运行以下命令：

$（'ul'）。listview（'refresh'）
尝试运行以下命令：
$（'ul'）。列表视图（'refresh'）
我自己解决了这个问题

我使用jQuery插件使用以下代码初始化此表单：

designFrameManager.updateFrameBody(data); // data is a HTML string.

    projectDesigner = $(data).projectDesigner({
        height: designFrameManager.getBodyHeight(),
        width: designFrameManager.getBodyWidth(),
        projectName: name
    });
designFrameManager.updateFrameBody（数据）；//数据是一个HTML字符串。
projectDesigner=$（数据）。projectDesigner({
高度：designFrameManager.getBodyHeight（），
宽度：designFrameManager.getBodyWidth（），
项目名称：名称
});
updateFrameBody（）方法的代码：

this.updateFrameBody = function (ui, initFunction) {

        _designFrameBody.html(ui);

        if (initFunction != null && $.isFunction(initFunction))
            initFunction();

    };
this.updateFrameBodyByObject = function (ui, initFunction) {

        _designFrameBody.html("");
        _designFrameBody.append(ui);

        if (initFunction != null && $.isFunction(initFunction))
            initFunction();

    };
this.updateFrameBody=函数（ui，initFunction）{
_designFrameBody.html（ui）；
if（initFunction！=null&$.isFunction（initFunction））
initFunction（）；
};
我认为插件的初始化不能绑定到DOM，因为初始化操作是在UI绑定到DOM之后进行的，所以DOM不能在我的脚本调用之后自动刷新更改

因此，我将代码更新为：

projectDesigner = $(data).projectDesigner({
        height: designFrameManager.getBodyHeight(),
        width: designFrameManager.getBodyWidth(),
        projectName: name
    });

    designFrameManager.updateFrameBodyByObject(
       projectDesigner // initialized object
    );
projectDesigner=$（数据）。projectDesigner({
高度：designFrameManager.getBodyHeight（），
宽度：designFrameManager.getBodyWidth（），
项目名称：名称
});
designFrameManager.updateFrameBodyByObject(
projectDesigner//初始化对象
); 
updateFrameBodyByObject（）方法的代码：

this.updateFrameBody = function (ui, initFunction) {

        _designFrameBody.html(ui);

        if (initFunction != null && $.isFunction(initFunction))
            initFunction();

    };
this.updateFrameBodyByObject = function (ui, initFunction) {

        _designFrameBody.html("");
        _designFrameBody.append(ui);

        if (initFunction != null && $.isFunction(initFunction))
            initFunction();

    };
this.updateFrameBodyByObject=函数（ui，initFunction）{
_designFrameBody.html（“”）；
_designFrameBody.append（ui）；
if（initFunction！=null&$.isFunction（initFunction））
initFunction（）；
};
此问题已成功修复

感谢所有回复。
我自己解决了这个问题

我使用jQuery插件使用以下代码初始化此表单：

designFrameManager.updateFrameBody(data); // data is a HTML string.

    projectDesigner = $(data).projectDesigner({
        height: designFrameManager.getBodyHeight(),
        width: designFrameManager.getBodyWidth(),
        projectName: name
    });
designFrameManager.updateFrameBody（数据）；//数据是一个HTML字符串。
projectDesigner=$（数据）。projectDesigner({
高度：designFrameManager.getBodyHeight（），
宽度：designFrameManager.getBodyWidth（），
项目名称：名称
});
updateFrameBody（）方法的代码：

this.updateFrameBody = function (ui, initFunction) {

        _designFrameBody.html(ui);

        if (initFunction != null && $.isFunction(initFunction))
            initFunction();

    };
this.updateFrameBodyByObject = function (ui, initFunction) {

        _designFrameBody.html("");
        _designFrameBody.append(ui);

        if (initFunction != null && $.isFunction(initFunction))
            initFunction();

    };
this.updateFrameBody=函数（ui，initFunction）{
_designFrameBody.html（ui）；
if（initFunction！=null&$.isFunction（initFunction））
initFunction（）；
};
我认为插件的初始化不能绑定到DOM，因为初始化操作是在UI绑定到DOM之后进行的，所以DOM不能在我的脚本调用之后自动刷新更改

因此，我将代码更新为：

projectDesigner = $(data).projectDesigner({
        height: designFrameManager.getBodyHeight(),
        width: designFrameManager.getBodyWidth(),
        projectName: name
    });

    designFrameManager.updateFrameBodyByObject(
       projectDesigner // initialized object
    );
projectDesigner=$（数据）。projectDesigner({
高度：designFrameManager.getBodyHeight（），
宽度：designFrameManager.getBodyWidth（），
项目名称：名称
});
designFrameManager.updateFrameBodyByObject(
projectDesigner//初始化对象
); 
updateFrameBodyByObject（）方法的代码：

this.updateFrameBody = function (ui, initFunction) {

        _designFrameBody.html(ui);

        if (initFunction != null && $.isFunction(initFunction))
            initFunction();

    };
this.updateFrameBodyByObject = function (ui, initFunction) {

        _designFrameBody.html("");
        _designFrameBody.append(ui);

        if (initFunction != null && $.isFunction(initFunction))
            initFunction();

    };
this.updateFrameBodyByObject=函数（ui，initFunction）{
_designFrameBody.html（“”）；
_designFrameBody.append（ui）；
if（initFunction！=null&$.isFunction（initFunction））
initFunction（）；
};
此问题已成功修复

感谢所有回复。
谢谢，但此问题不是jQuery Mobile出现的。谢谢，但此问题不是jQuery Mobile出现的。