Добавить контент через ajax, но событие mouseenter неэффективно

Существует HTML-таблица, и в каждой строке я добавляю значок "редактировать", когда мышь вводит значок, появляется всплывающее меню. В функции document.ready указатель события действует. Но если я добавлю новую строку через dajax, событие mouseenter будет неэффективным.

function add_finding(table_type){
if(!check_finding_attribute(table_type))
    return;
else{
Dajaxice.codeinsight.add_finding(Dajax.process,get_finding_attribute_dict(table_type));
    reset_finding_attribute(table_type);
    //reload the popup menu
    $(".menubox").each(function(){
        var menubox_id=$(this).attr("id");
        var showmenu_id=menubox_id.replace("menubox","showmenu");
        $.showmenu("#"+showmenu_id,"#"+menubox_id);
    });
}
}

$(document).ready(function(){
jQuery.showmenu = function(showbtnid,showboxid) {
    var showmenubtn = $(showbtnid);
    var showmenubox = $(showboxid);
    showmenubtn.mouseenter(function(e){
        var thish = $(this).height();
        var offset = $(this).offset();
        var tipx = offset.left;
        var tipy = offset.top+thish-1;
        showmenubox.show().css("left",tipx).css("top",tipy);
        t= setTimeout(function(){showmenubox.hide();},1000);
      });
    showmenubox.mouseenter(function(){
        clearTimeout(t);
    });
    showmenubox.mouseleave(function(){
        $(this).hide();
    });
};
$(".menubox").each(function(){
    var menubox_id=$(this).attr("id");
    var showmenu_id=menubox_id.replace("menubox","showmenu");
    $.showmenu("#"+showmenu_id,"#"+menubox_id);
});
});

1 ответ

Решение

Если контент поступает через AJAX, и вы также хотите привязать событие к этому, вам следует.

jQuery.on(...)

нормальная привязка событий не будет работать для тех.

jQuery.on("mouseenter", showbtnid,function(){...})

Приведенная выше привязка будет обрабатывать существующие элементы, а также новые добавленные элементы в будущем.

Удачного кодирования:)

Другие вопросы по тегам