Question

我有一个页面，其中的内容通过ajax引入。我遇到的问题是在加载内容后添加相关的事件侦听器。有没有办法告诉浏览器再次从头部运行所有脚本？

下面是一个从页面头部运行的代码的简单示例，显然任何与通过AJAX引入的“.RRCustomizeBox .customize”匹配的新html元素都不会有以下点击事件。

例如：

_vvdCMS.kklsRegions = {

    init: function (){
        $(document).ready(function(){

            $('.RRCustomizeBox .customize').click( function(){
                _vvdCMS.kklsRegions.showRRCustoms(this);
            });

        });
    },

    showRRCustoms: function(obj) {
        var objParent = $(obj).parent();
        objParent.find('.RRCustomizeBoxForm').fadeIn(700);
    }
}
_vvdCMS.kklsRegions.init();

感谢您的任何提示，

约翰

Answer 1

您可以将所有初始化代码放在一个函数中，并从两个位置调用该函数：

在document.ready（）
加载新内容后

例如：

function initDynamicEventHandlers() {
    // set up your event handlers here
}

$(document).ready(initDynamicEventHandlers);

$(whatever).load(url, initDynamicEventHandlers)

您必须确保未替换的任何内容都不会安装多个事件处理程序。

或者，第二个选项，对于某些类型的逻辑（如鼠标和键事件），您可以使用委托事件处理并在连接到未替换的静态父对象时安装事件处理，并且事件处理将起作用不会更改您下面发生变化的动态内容。

为此，您使用.on()的委托形式：

$(static parent object selector).on('click', dynamic object selector, fn)

Answer 2

这可能是迟到的，但这就是我在需要ajax时所做的事情。

$(document).ready(function () {
$(document.body).on('click', '.Selector_S', function () { function_F(event, this) })
}

function function_F(event, d){
...do sth here...
}

你根本不需要重新启动事件监听器或在ajax函数中写任何东西。

重新启动事件监听器javascript / jquery

2 个答案: