2

ドリルダウン中に HighMaps で選択された状態に基づいて、物事をリストするテーブルを表示する作業を行っています。

コードスニペット：

                switch (e.point.name) {
                    case 'California':
                        $('#table').html('');
                        break;
                    case 'Virginia':
                        $('#table').html('');
                        break;
                    default:
                        $('#table').html('');
                        break;
                }
<div id="table"></div>

テーブルは、PHP を使用して状態ごとに DB からデータを取得して動的に生成されます。テーブル構造は次のようになります。

 <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <h3 class="panel-title text-center">Company List - State</h3>
                        </div>
                        <table class="table table-hover" id="dev-table">
                            <thead>
                                <tr>
                                    <th>Company Name</th>
                                    <th>County</th>
                                    <th>Details</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>Company 1</td>
                                    <td>Test County</td>
                                    <td>Company details.</td>
                                </tr>
                                <tr>
                                    <td>Company 2</td>
                                    <td>Test County</td>
                                    <td>Company details.</td>
                                </tr>
                                    <td>Company 3</td>
                                    <td>Test County</td>
                                    <td>Company details.</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

.html('') 内で生成されたテーブル出力は次のようになります。

 $('#table').html('<div class="container"> <div class="row"><div class="col-md-12"><div class="panel panel-primary"><div class="panel-heading"><h3 class="panel-title text-center">Company List - California</h3></div><table class="table table-hover" id="dev-table"><thead><tr><th>Company Name</th><th>County</th><th>Details</th></tr></thead><tbody><tr><td>Company 1</td><td>Test County</td><td>Company details are available to ACMA members only.</td></tr><tr><td>Company 2</td><td>Test County</td><td>Company details are available to ACMA members only.</td></tr><td>Company 3</td><td>Test County</td><td>Company details.</td></tr></tbody></table></div></div></div></div>');

企業のリストが小さい場合、すべてがうまく機能します。州ごとの会社の数が大きくなり、生成されたテーブル コードが長くなると、動作が停止します。私はそれをテストしました。長すぎる生成コードの一部を取り、その半分を削除すると、すべてが再び機能し始めます。

.html(); 内に入れることができる文字数に制限はありますか? ? これらのテーブルを表示するより効率的な方法はありますか?

4

1 に答える 1

0

現在 $("#table").append(); を使用しているような特定のセレクター内で追加機能を使用するのはどうですか? 以下のリンクを確認してください。

http://api.jquery.com/append/

于 2015-02-10T23:21:52.750 に答える