【问题标题】：jquery mobile button style is lost on localizationjquery 移动按钮样式在本地化时丢失
【发布时间】：2014-04-25 08:24:35
【问题描述】：

我正在使用本地化库 i18Next 处理 jquerymobile 项目

html代码

<div id="messageboxPage" data-role="page" data-theme="a">
    <div data-role="header" data-theme="a"></div>
    <div id="messagePage" data-role="content" data-theme="a">
        <div class="barContainer" id="barContainer">
            <div class="ui-bar ui-bar-b  ui-btn-corner-all" style=" margin-top: 40px; padding-left: 0px;padding-right:10px; ">
                <div style="float: left;  width: 30%;"> <a href="#" id="aNo" onclick="SetActive('aNo')" class="LnkButton" data-theme="a" data-role="button" data-inline="true" data-mini="true">Cancel</a> 
                </div>
                <div style="float: left;   width: 30%;padding-left: 6%; padding-right: 2%;"> <a href="#" id="aAccept" onclick="Supprimer();" data-theme="a" class="LnkButton" data-role="button" data-inline="true" data-mini="true">Delete</a> 
                </div>
                <div style="float: right; width: 30%;"> <a href="#" id="aReply" onclick="Reply();" data-theme="a" class="LnkButton" data-role="button" data-inline="true" data-mini="true">Reply</a> 
                </div>
            </div>
        </div>
    </div>
</div>

js代码

 window.opts = {
     lng: 'fr',
     getAsync: true,
     // fallbackLng: 'en',
     ns: {
         namespaces: ['ns.controls'],
         defaultNs: 'ns.controls'
     },
     useLocalStorage: false,
     debug: true
 };
 $.i18n.init(opts).done(function () {
     alert('i18n init function');
     $('#aNo').text("No Merci!");
     $('#aAccept').text("Supprimer");
     $('#aReply').text("Respondre");
     $('#messageboxPage').trigger('pagecreate');
 });

 $(document).ready(function () {
     alert('messagebox document ready');
 });

现在的问题是文本已更改但按钮样式丢失第二个问题设置带有标签的文本我已尝试页面创建触发器，但它不工作你的建议。这里正在工作jsfiddle

【问题讨论】：

标签： jquery html css jquery-mobile i18next

【解决方案1】：

要更改按钮的文本，您必须修改 .ui-btn-text 元素的文本，这比 span > span 好得多：

$('#aNo .ui-btn-text').text("No Merci!");
$('#aAccept .ui-btn-text').text("Supprimer");
$('#aReply .ui-btn-text').text("Respondre");

Fiddle

【讨论】：

【解决方案2】：

这对我有用

$.i18n.init(opts).done(function () {
     alert('i18n init function');
     var message_type = 0;
     if (message_type == "0") {
         alert('from 0');
         $('#lblTo').text("from 0");
     } else if (message_type == "1") {
         alert('to 1');
         $('#lblTo').text("to 1");
     } else if (message_type == "2") {
         alert('from 2');
         $('#lblTo').text("from 2");
     }

     $('lblDate').text($.t('Messagebox.lblDate'));
     $('lblSubject').text($.t('Messagebox.lblSubject'));


     //////////////////////////this is where i was wrong
     $('#aNo > span > span').text("No Merci!");
     $('#aAccept > span > span').text("Supprimer");
     $('#aReply > span > span').text("Respondre");
     ///////////////////////////

     $('#messageboxPage').trigger('pagecreate');
 });

【讨论】：