0

私のHTMLには、次のようなテーブルスケルトンがあります。

<table>
    <thead id="table-headings"></thead>
    <tbody id="table-body"></tbody>
</table>

さらに、<div id="content"></div>後で使用するものがあります。

リクエストを使用して動的な方法でテーブル本体に行と列を入力し$.ajax()ます。テーブル内の各セルは単一ので埋められ<a href="#">some link here</a>ます。リンクの1つをクリックする$.ajax()と、サーバーへの別のリクエストが実行され、より多くのデータをに配置する必要がありますdiv#content。リンクは動的に読み込まれるため、次のようにイベント委任を使用します。

$('#table-body').on('click', 'a', function(event) {
    $.ajax({
        // some settings here
        success: function(response) {
            // Append some data to the content div
            $('#content').append(...);
        }
    });    
});

これはすべて正常に機能します。ここで問題があります。私が追加するデータの一部は、タグでdiv#content囲まれたhtmlソースコードです。スニペットjQuery構文強調表示プラグイン<pre></pre>を使用してこのソースコードを強調表示したいと思います。イベント委任ルールによると、これは理論的には次のように機能するはずです。

$('#content').on('...', 'pre', function(event) {
    $(this).snippet('html');
});

私の問題は、イベントハンドラーをどのJavaScriptイベントにバインドすべきかわからないことです。基本的に、ロードされたコードスニペットを強調表示したいだけですが、jQueryload()とready()メソッドは異なる目的を対象としているため、ここに適合するJavaScriptイベントはないようです。動的にロードされたHTMLコードを強調表示するにはどうすればよいですか？

4

3 に答える 3

1

このためのイベントは必要ありません...<pre>コンテンツが追加された後、findを使用してajaxsuccess関数でタグを取得します。このように..DOM要素はすでにドキュメントに追加されています。それを見つける

success:function(response){
  ....//your stuff;
  $('#content').find('pre').snippet('html');
 }
于 2013-02-12T13:11:10.940 に答える
1

やってみました：

$('#table-body').on('click', 'a', function(event) {
    $.ajax({
        // some settings here
        success: function(response) {
            // Append some data to the content div
            $('#content').append(...);
            $('#content').find('pre').snippet('html');
        }
    });    
});
于 2013-02-12T13:07:12.337 に答える
0

試してみませんか：

$('#table-body').on('click', 'a', function(event) {
    $.ajax({
        // some settings here
        success: function(response) {
            // Append some data to the content div
            $newElemement=$(response)
            $('pre',$newElement).snippet('html')
            $('#content').append($newElement);
        }
    });    
});
于 2013-02-12T13:07:17.553 に答える