0

JQueryを扱うInternet ExplorerまたはIEを扱うJQueryに問題があります:)

単に私は次のコードを持っています:

$(function () {
   $("*").each(function (i) {
    var textalign = $(this).css("text-align");
    if (textalign == "left") {$(this).css({'text-align': 'right'});} 
      else if (textalign == "right"){$(this).css({'text-align': 'left'});}
   });
});

コードの機能は、すべてのタグの text-align を交換することです。FF と Chrome では、このコードは完璧に動作しますが、IE では問題があり、親プロパティを変更した後に継承された text-align プロパティを読み取り、それを交換すると思いますまた ！

何が起こっているのかを理解するために、JQueryコードを適用した後のソースコードの2つの画像をここに添付しました:

FFで（パーフェクト！）：Firefox の結果のソース コードのスナップショット

IEで（間違って！）：IE 結果のソースコードのスナップショット

ところで、このように使用することについて疑問がある場合は、私はオープン ソース プロジェクトを所有しており、テーブルも含めて数百の JSP でインライン スタイルを使用しているため、レイアウトを反転させて多言語製品をサポートするための回避策 (ltr & rtl 言語をサポート) ...

うまくいけば、解決策が見つかりました。

注: 私は JQuery 1.7.1 を使用しています ... この問題は ie8 & ie9 で発生しました。

注 2:jQuery("*").each(jQuery("*").get().reverse(), function (i) {またはを使用すると、最悪の結果が得られました。jQuery(jQuery("*").get().reverse()).each(function (i) {

編集1＆2：この質問の中にありました

編集3：

注 3: ページ上のすべての要素で問題が発生してscriptいhtmlますstyle。このスクリーンショットを参照してください： すべての要素ですが、一部も !

編集4：

私の問題は部分的に解決され、IE9ではうまく機能し、IE8では機能せず、Stefanからの解決策があり、私のコードで要約する多くの方法を試した後:

JQueryコードで：

if (jQuery.browser.msie == false || jQuery.browser.msie == undefined) { 
            if (textalign == "left") {jQuery(this).css({'text-align': 'right'});} 
            else if (textalign == "right"){jQuery(this).css({'text-align': 'left'});}
        }

IE のみに読み込まれた CSS ファイル:

body *[style*="text-align: left"] {
  text-align: right !important;
}

body *[style*="text-align: right"] {
  text-align: left !important;
}

よろしく、

4

3 に答える 3

3

これは役に立ちませんか？

body.rtl * {
  text-align: right !important;
}

ルールを保持する必要がある要素をtext-align: left特定の CSS クラスでマークして、残りの要素から分離する必要があります。

この CSS を試して、text-align 値を切り替えることもできます

body *[style*="text-align: left"] {
  text-align: right !important;
}

body *[style*="text-align: right"] {
  text-align: left !important;
}

これはまだテストしていませんが、スタイル属性値に「text-align: left」を含むすべての要素を作成して、そのルールを使用する必要があります。

アップデート

jsFiddleで例を作成しました。それが役に立てば幸い。

更新 2

jQuery を使用した新しいソリューション: jsFiddle

$('body *[style*="text-align"]').each(function() {

    // Toggle text-align value
    $(this).css('text-align', (($(this).css('text-align') == 'left') ? 'right' : 'left'));

});
于 2011-11-28T16:16:38.833 に答える
1

ループを逆に実行して問題を回避してみませんか?

これを置き換えます：

$("*").each(function (i) {

これとともに：

$.each($("*").get().reverse(), function (i) {
于 2011-10-20T14:26:33.220 に答える
0

これは非常に興味深い問題です。<p>基本的に、コンテンツ ( 、<div>、など) を含むことができる DOM の一部を選択し、<span>他のすべての要素を除外したいようです。

jQuery疑似セレクターが機能するように思えます$(":visible")が、IE がこの値を完全に無効な要素に割り当てたことを考えると、私には疑問があります。

クレイジーかもしれませんが、style="text-align: right"有効なコンテンツ レベルの DOM 要素のリストを作成することを検討する必要があるかもしれません。製品の使用年数や生成される HTML の種類によっては、これは非常に骨の折れる作業になる可能性があります。10 個または 12 個の要素のセットを扱っている場合は、これを処理するスタイル シートを記述し、jQuery を介してそれをロードする価値があるかもしれません (すべてのページに簡単に含めることができないと仮定して)。

于 2011-11-28T16:10:17.007 に答える