0

因此,与其他许多人一样,我在处理使用 ajax 加载的外部页面的脚本时遇到了问题。

我试图在其顶部设置一个带有“管理面板”的页面。我希望能够导航到面板中的多个管理页面。不同的管理页面同时包含内部<script>和外部 js 文件。脚本按应有的方式加载,但它们似乎堆积起来或没有得到很好的管理。

我在其中一个管理页面上做了一个小测试:

$('.left-col').click(function () {
    alert();
});

在这里,每当我返回此页面时,它都会将另一个单击绑定到它,因此每次单击 div 时都会收到两个警报。$('.left-col').unbind();我可以通过在我的 ajax.success 中运行来轻松解决这个问题。

然而,对于某些管理页面,有大量的 .click/.change/.live 等,我什至不确定它们是什么(即来自外部插件)。那么我可以以某种方式取消绑定/删除从每个 ajax 加载页面加载的所有脚本,而无需指定每个元素吗?我知道我可以将选择器与 unbind 一起使用,但循环遍历每个 div/img/input 等并取消绑定似乎不是很有效,我什至不确定它是否会起作用。

这是我加载管理页面的方式:

<script type="text/javascript">
$(document).ready(function() {  

function reloadAdminPanel(url) {
    if(typeof(url)  === "undefined") {
        var url = '/admin/panel/dashboard/';
    }

    $.ajax({
        'success': function (data, textStatus) { 
            var jData = $(data);

            // override links in admin to run reloadAdminPanel()
            jData.find('a').each(function() {
                var newUrl = $(this).attr('href');

                $(this).click(function(e) {
                    reloadAdminPanel(newUrl);
                    return false; 
                });

            });


            $('div.panel__inner').remove();
            $('body').prepend(jData);
            delete jData;
        },
        'url':  url
    });

}
reloadAdminPanel();
});
</script>

任何帮助表示赞赏,干杯!

页面结构:

<html>
<body>
<div class="panel__inner"> <!-- admin panel --> </div>
    <!-- rest of project site -->
</body>
</html>
4

1 回答 1

0

如果您向我们展示元素的结构,也许它会有所帮助,但是从 Jquery 中“删除”的定义来看,它应该删除元素、它的子元素、所有事件以及与之关联的任何数据。

div.panel__inner 是否位于您的身体标签内?我看到您正在对 div 进行删除,但将数据添加到 $('body')。您可以删除正文内容本身吗?

于 2011-09-02T11:34:11.357 回答