加载动态内容后执行功能

Question

我有一张桌子，我需要在上面执行一项功能。虽然它位于搜索结果页面上，但在执行搜索（或加载另一页结果）后，div 内的内容会发生变化。不幸的是，我无法访问被调用来更改数据的 ajax 方法（它是一个在整个站点中全局使用的函数，无法更改到此页面）。

我想要做的是，每次 $("#search_results) div 更改时，我想循环遍历结果集，删除内联定义的 onclick 事件，并使用我自己的 onclick 函数。这里是一个示例（第一次加载页面时有效，但在 ajax 调用更改搜索结果后无效）：

<script type='text/javascript'>

    $(document).live(function(){
        alert('fired'); 
        $('table.lookup_table tr').each(function(){
            $(this).removeAttr('onclick');      
        });
    });

$('table.lookup_table tr').on('click', function(event){
        event.preventDefault();
        $(this).removeAttr('onclick');  
        var pacware = $.trim($(':nth-child(1)', $(this)).html());
        var site = $.trim($(':nth-child(2)', $(this)).html());

        window.location = '<?php echo matry::here_to('edit');?>&pacware_code=' + pacware + '&site_id='+site;
        return false;
    });
</script>

*另外，我需要这个才能在 IE 8 中工作 *

Answer 1

你可以试试这个，但这不是好方法：

$('body').on('click', 'table.lookup_table tr', function(e){
        e.preventDefault();
        e.stopPropagation();
        //...
        return false;
    });

它会在每次点击时检查您是否点击了与table.lookup_table tr 匹配的元素，如果是，则执行事件处理程序。