2

jQuery Mobile Demo サイト(jQuery Mobile 1.4.2) のこのページのコードを i18next 変換ツールで使用したいのですが、モバイルでテーブルを表示するとテーブル ヘッダーが消えてしまいます。

ウィンドウが特定のしきい値よりも小さい場合、jQM はヘッダー タグ テキストを取得し、各行の値の前に配置することを理解しています。

ここでデモを作成しました。実際に表示するには、ブラウザの幅を変更してください。

上のテーブルは意図した動作をしていますが、テーブル ヘッダーのインライン テキストです。下のテーブルは、ワイド スクリーンでは i18n テーブル ヘッダーが 1、2、3、4 として正しく表示され、狭いスクリーンでは消えるという問題を示しています。

モバイル ビューのヘッダーで i18n 翻訳を使用する方法を探しています。これは、サイトの残りの部分で既に実装されており、美しく機能するためです。

ご協力いただきありがとうございます！

4

1 に答える 1

1

テキストを翻訳rebuildした後、テーブルに移動するだけです。

なんで？テーブルウィジェットは のヘッダーをコピーし、コンテンツの前theadに追加して非表示にします。tbody小さな画面でtheadは、非表示になり、コピーされたヘッダーが表示されます。

翻訳時に、theadヘッダーのみに変更を適用し、 の非表示のヘッダーには適用しませんtbody。

i18n.init({
    preload: ['en', 'dev']
});
i18n.init({
    detectLngQS: 'lang'
});
i18n.init(function (t) {
    $("body").i18n();
    var appName = t("app.name");
    $("tableID").table("rebuild"); /* this */
});

デモ

于 2014-06-10T23:14:46.043 に答える