重新开始的事件侦听器的JavaScript / jQuery的 [英] Reinitiate events listeners javascript/jquery

问题描述

我有哪些内容是通过AJAX带来了一个页面。我遇到的问题是增加相关的事件侦听器的内容加载之后。有没有办法告诉浏览器运行从头部中的所有脚本了吗？

I have a page in which content is brought in via ajax. The problem I am having is adding the relevant event listeners after the content has loaded. Is there a way to tell the browser to run all the scripts from the head again?

下面是code，从页面的头，显然任何新的HTML元素匹配.RRCustomizeBox .customize通过AJAX带来了不会有以下click事件运行得到一个简单的例子。

Below is a simple example of code that gets run from the head of the page, obviously any new html elements matching '.RRCustomizeBox .customize' brought in via AJAX will not have the following click event.

例如：

_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();

感谢您的任何提示，

Thanks for any tips,

约翰·

推荐答案

您可以将所有的初始code中的函数，并调用该函数，从两个地方：

You can put all your initialization code in a function and call that function from two places:

1. 在的document.ready（）
2. 在加载新的内容

例如：

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

$(document).ready(initDynamicEventHandlers);

$(whatever).load(url, initDynamicEventHandlers)

您必须确保未替换任何内容没有得到安装了多个事件处理程序。

You will have to make sure that any content that is not replaced does not get multiple event handlers installed.

或者，第二个选项，你对某些类型的逻辑（如鼠标和键盘事件），则可以使用委派的事件处理，并安装事件处理，一旦连接到未更换一个静态的父对象和事件处理将工作没有变化的动态内容，改变的下方。

Or, second option, you for some types of logic (like mouse and key events), you can use delegated event handling and install the event handling once attached to a static parent object that is not replaced and the event handling will work without change for your dynamic content that changes underneath.

对于这一点，您使用。对（）委派的形式：

For that, you use the delegated form of .on():

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

这篇关于重新开始的事件侦听器的JavaScript / jQuery的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！