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>. 通过单击其中一个链接，$.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 源代码<pre></pre>。我想使用片段 jQuery 语法突出显示插件突出显示此源代码。根据事件委托规则，这在理论上应该通过以下方式起作用：

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

我的问题是，我不知道应该将事件处理程序绑定到哪个 JavaScript 事件。基本上，我只想在加载代码片段后突出显示它们，但似乎没有适合这里的 JavaScript 事件，因为 jQueryload()和ready()方法用于不同的目的。如何突出显示动态加载的 html 代码？

4

3 回答 3

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 回答
1

您不需要任何事件...只需<pre>在追加内容后使用 find 获取 ajax 成功函数中的标签..这种方式.. DOM 元素将已经添加到文档中.. 并且能够发现

success:function(response){
  ....//your stuff;
  $('#content').find('pre').snippet('html');
 }
于 2013-02-12T13:11:10.940 回答
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 回答