如何将事件监听器仅附加到新创建的元素?

时间:2012-10-17 17:20:55

标签: javascript jquery

当我触发一个函数时,我希望它只将侦听器应用于我传递的元素,特别是this jQuery元素。

addEventListeners(this);

function addEventListeners(el) {
        $(el).mouseenter(function() { 
            $(this).stop(true,true).switchClass("", "HIGHLIGHT", 400, "easeInOutQuad");
        });
        $(el).mouseleave(function() { 
            $(this).stop(true,true).switchClass("HIGHLIGHT", "", 400, "easeInOutQuad");
        });
    }

它从AJAX结果中激发:

    $.post(url,{el:wartosc_inputa},function(returned) {
        var data = $(returned).hide(); 
        $("#listaElementow").prepend(data); 
        data.slideDown();
        loading();
        addEventListeners(this);
    });

如何编码好?此代码未将变量从addEventListeners(this);传递给函数。

3 个答案:

答案 0 :(得分:2)

在ajax回调函数中“this”将是我认为的ajax对象,不再是元素,所以你需要在ajax启动之前将“this”保存在变量中。

that = this;
$.post(url,{el:wartosc_inputa},function(returned) {
    var data = $(returned).hide(); 
    $("#listaElementow").prepend(data); 
    data.slideDown();
    loading();
    addEventListeners(that);
});

答案 1 :(得分:0)

在这种情况下,

this不是你所期望的那样。试试这个:

var self = this;
$.post(url,{el:wartosc_inputa},function(returned) {
    var data = $(returned).hide(); 
    $("#listaElementow").prepend(data); 
    data.slideDown();
    loading();
    addEventListeners(self);
});

答案 2 :(得分:0)

从成功处理程序的其余部分的上下文判断,我假设returned是您尝试将处理程序绑定到的DOM元素。假设情况如此:

$.post(url,{el:wartosc_inputa},function(returned) {
    var data = $(returned).hide(); 
    $("#listaElementow").prepend(data); 
    data.slideDown();
    loading();
    addEventListeners(data[0]);
    // change this    ^^^^
    // pass the DOM element here, or 
    // change the addEventListeners function to take a jquery element
});