Question

我正在为我的最后一年项目开发一个基于Web的文档管理。用户只与一个页面交互，当用户单击相应的选项卡（使用选项卡进行导航）时，将使用AJAX调用相应的页面。

由于多个用户级别（管理员，经理等），我已将javascripts放入相应的网页中。

当用户请求用户请求时，除了某些功能被多次触发的情况外，每个人都能正常工作。我发现了这个问题。每次用户点击一个标签时，它都会加载与新实例相同的脚本，当我调用一个函数时，它们都会被触发。

加载我厌倦的内容

.load和$.ajax();非他们解决了这个问题。

This is how Firebug shows

我试图将所有内容放入主页面，因为我的jQueryUI不起作用。我累了

$(document).load('click', $('#tab_root li'), function(){});

同样的问题仍然存在。

任何人都可以帮我解决这个问题吗？

- 编辑 -

    $(function){
        $(document).on('click','#tabs',function(e){
            getAjax($(this))
        });

    }

    //method to load via AJAX
    function getAjax(lst){
        var cont = $(lst).text();
        $.ajax({
            url:'../MainPageAjaxSupport',
            data: {
                "cont":cont
            },
            error: function(request, status, error){
                if(status==404){
                    $('#ajax_body').html("The requested page is not found. Please try again shortly");      
                }
            },
            success: function(data){
                $('#ajax_body').html(data);
            },

        });


    }

Answer 1

只需卸载文件或删除脚本元素，就无法撤消JavaScript。

最好的解决方案可能是在ajax数据中包含的每个JavaScript文件中设置一个变量，并将其包含在ajax数据中的在线内联JavaScript中，并包含如下条件：

<script>
    if(!tab1Var) $.getScript("filename");
<script>

旧解决方案

您可以在关闭之前手动取消绑定每个事件。

$(function){
        $('#tabs').off('click');
        $('#tabs').on('click',function(e){
            getAjax($(this));
        });
}

或者，您可以为主html中的每个选项卡初始化一个全局变量（eventsBound1 = false）：

$(function){
    if(!eventsBound1){
        $('#tabs').on('click', function(e){
            getAjax($(this));
        });
        eventsBound1 = true;
    }
}

标签点击事件只是每次在重新加载的脚本中绑定事件时必须执行此操作的示例。

如果所有事件都绑定到ajax_body中的内容，那么你可以尝试的最后一件事是：

success: function(data){
    $('#ajax_body').empty();
    $('#ajax_body').html(data);
},

Answer 2

您已绑定活动点击＆＃39;文档＆＃39;所以getAjax（）只替换了＃ajax_body＆＃39;不是＆＃39;文件＆＃39;。

这意味着旧事件仍附加在＆＃39;文档上。您所需要的只是使用$(document).off('click');取消绑定事件或更改＆＃39;文档＆＃39;其他元素。

重复的javascripts正在加载ajax

2 个答案:

旧解决方案