Question

我的网络应用程序中包含了大量的ajax请求。

我将所有jquery和jquery小部件加载到头部然后在关闭body标签之前加载我的base.js。

function baseScripts() {
        $(".open-dialog").click(function (event) {
            event.preventDefault();
            event.stopPropagation();        
            alert("Opening dialog");        
            href = $().buildUrl($(this).attr("href"), "&isAjax=true");        
            $().createDialog(href, "Window Title");        
            return false;
        });

        $("input:hidden.select").each(function () {
                var element = $(this);            
                if (!($("#s2id_" + element.attr("id")).length)) {
                    $(element).select2({
                        // select2 properties...
                    });
                }
            });
        }
}

在每个AJAX请求中加载基础脚本的脚本

$(document).ajaxComplete(baseScripts);

问题是在每次ajax请求后，再次调用基本脚本，并且多次打开对话框并附加select2倍数。

我如何检测小部件是否已附加到元素或类中？在每个ajax请求上执行脚本（就像我做的那样）是一个糟糕的实践吗？

Answer 1

你想要重新绑定click事件并在ajaxComplete上选择2是没有意义的。它们应该是一次性绑定，在这种情况下，你可以这样做：

$(document).ready(function(){
    baseScripts();

    function baseScripts() {
        $(".open-dialog").click(function (event) {
            event.preventDefault();
            event.stopPropagation();

            alert("Opening dialog");

            href = $().buildUrl($(this).attr("href"), "&isAjax=true");

            $().createDialog(href, "Window Title");

            return false;
        });

        $("input:hidden.select").each(function () {
            var element = $(this);

            if (!($("#s2id_" + element.attr("id")).length)) {
                $(element).select2({
                    // select2 properties...
                });
            }
        });
    } 
});

附加JQuery检测小部件

1 个答案: