2

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

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

当用户请求时，用户请求一切正常，除了某些功能被多次触发的情况。我发现了问题。每次用户单击一个选项卡时，它都会加载与新实例相同的脚本，并且当我调用一个函数时它们都会被触发。

加载我累的内容

.load他们都$.ajax();没有解决这个问题。

这就是 Firebug 显示的方式

当时我试图将所有内容都放入主页中，我的 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);
            },

        });


    }
4

2 回答 2

1

在 JavaScript 执行后，您无法通过简单地卸载文件或删除脚本元素来撤消 JavaScript。

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

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

旧解决方案

您可以在将它们设置为 off 之前手动取消绑定每个事件。

$(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);
},
于 2013-08-15T21:26:58.683 回答
0

您已绑定单击“文档”的事件，因此 getAjax() 仅替换“#ajax_body”而不是“文档”。

这意味着旧事件仍附加到“文档”，您只需通过使用$(document).off('click');“文档”或将“文档”更改为其他元素来取消绑定事件。

于 2015-01-21T06:20:32.753 回答