1

私はJQuery 1.6と最新のテーブルソーター(ソートテーブル)を使用しています。私は1つのページを持っています

$("div#child_container").load(child_url);

「child_url」が参照するページにはソートテーブルがあります。

FireFox 8 では、これは期待どおりに機能します。div に並べ替え可能なテーブルが埋め込まれています。

FireFox 3.5 では動作しません。列見出しはクリックできません。それらはプレーンテキストです。シマウマのスタイリングも行われておらず、最初の並べ替えも行われていません。FireBug を実行すると、child_url がロードされ (データのテーブルがロードされるため、これが確認されます)、sorttable.js ファイルがロードされることが示されます。エラーはありません。すべての警告は CSS 関連です。

child_url を FireFox 3.5 に読み込むことができ、期待どおりに動作するため、これはテーブルソーター自体の問題ではないようです。tablesorter を使用するページを含めるために JQuery .load() を実行すると問題が発生するようです。

どのように進めるかについての提案をお待ちしています。「申し訳ありませんが、あなたのブラウザは古すぎて壊れています」と言うだけではありません。

編集: jquery.tablesorter.js に切り替えました。同じ問題。

編集: doctype や head などを提供しないようにページchild_urlを改造しました。.js ファイルの読み込みを親ページに昇格させました。これは、3.5 と 8.0 で同じように誤動作しました。呼び出しで、これまでにないJavaScript エラーが発生しました。<table><script>$("#tablediv").tablesorter( ... ).tablesorter()

4

1 に答える 1

0

まず、Alfabravo の功績を称える方法があれば、そうします。彼のコメントで問題が完全に解決されたわけではありませんが、正しい方向に進みました。

child_urlのみを提供するようにページを削除しました<table>jquery.tablesorter.js親ページに引き上げました。.tablesorter()テーブルで実行するには親ページが必要でした。

$("div#pending").load(
    "pending.jsp", 
    function() {
        $("table#pending_records").tablesorter( {
            sortList: [[4, 0]],
            widgets: ["zebra"]
        } );
    } 
);

JQuery.load()ロードする URL と、完全にロードされたときに実行するコールバックを指定できます。これは、2 回目の編集で言及した Javascript エラーを回避するために必要な秘密のソースでした。

別のメモ:実際には、を使用して2つの異なるタブに2つのソートテーブルをロードしていjquery.ui.tabs.jsました。2番目のタブも動作していませんでした。sorttableであるブロック内にある場合は機能しないためですdisplay: none。ページが読み込まれたとき:

  • 最初のタブのコンテンツが表示されていたため、そこのコンテンツは適切にレンダリングされました
  • 2 番目のタブのコンテンツが非表示になっていたため、コンテンツを読み込んでいました.sorttable()が、実行されていなかったため、適切にレンダリングされませんでした

JQuery.load()ドキュメントページに記載されているハックを使用して、それを回避することができました。基本的に、代わりに次のようにスタイルシートを微調整します。

.ui-tabs .ui-tabs-hide { display: none; }

それは持っています:

.ui-tabs .ui-tabs-hide { position: absolute; left: -10000px; }

コンテンツを含むフレームが「表示」されているため (画面外ではありますが)、.sorttable()期待どおりに動作します。

于 2011-12-22T20:34:01.833 に答える