如何在使用JQuery Mobile进行javascript编辑后刷新/保留HTML格式

时间:2013-01-12 23:56:52

标签: javascript html5 jquery-mobile

我正在尝试设置支持多种语言的功能,通过运行javascript函数来用不同的语言替换html。该脚本似乎运行正常,但在这样做时,我放弃了JQUery Mobile附带的格式

我正在使用以下表单进行替换

for (var i = 1, e; e = document.getElementById("input1_" + i); ++i)
  e.innerHTML = input[2, 1];

我的格式为input1_1的id,input1_2 ...等替换

我有一个小提琴来说明一个有效的例子 - 见http://jsfiddle.net/eKXPU/4/

如果您尝试使用小提琴,您将看到当您单击俄语时,“属性”会正确更改,但会丢失格式。单击俄语等效文件仍会打开可折叠内容,但是它确实只是格式化问题

任何帮助表示感谢 - 我希望它像刷新JQuery CSS一样简单,但不知道该语法是什么。

由于

编辑:尝试添加

$('#home').trigger('pagecreate');

在脚本之后,在How do I refresh the CSS for a DIV loaded with external content in JQuery Mobile处回复回复,但这也无效

1 个答案:

答案 0 :(得分:1)

因为您使用jQuery Mobile动态更改html。处理完之后你的html看起来像这样:

<h3 id="input1_1" class="ui-collapsible-heading ui-collapsible-heading-collapsed">
    <a href="#" class="ui-collapsible-heading-toggle ui-btn ui-btn-up-c ui-fullsize ui-btn-icon-left ui-corner-top ui-corner-bottom ui-btn-up-null" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="plus" data-iconpos="left" data-theme="null" data-mini="false">
        <span class="ui-btn-inner ui-corner-top ui-corner-bottom">
            <span class="ui-btn-text">Properties
                <span class="ui-collapsible-heading-status"> click to expand contents</span>
            </span>
            <span class="ui-icon ui-icon-plus ui-icon-shadow">&nbsp;</span>
        </span>
    </a>
</h3>

正如您所看到的,现在无法访问文本。我的解决方案是将文本包装在另一个没有其他意义的范围like this