Jquery选择器对添加的标签不起作用

jquery selector doesn't work on added tag

本文关键字：标签 不起作用 添加 选择器 Jquery      更新时间：2023-09-26

我有问题的新创建的元素使用jQuery我的小脚本在这里:

$('.view_button').click(function(){
    $.ajax({
        url: '/devices/view_ajax',
        cache: false,
        type: 'post',
        dataType: 'JSON',
        data: {id: $(this).attr('data')},
        success: function(data){
            var maskHeight = $(window).height();
            var maskWidth = $(window).width() - 100;
            var body = $('#devices_wrapper');
            var div_outside =  $('<div/>', {id:'wrapper'}).appendTo(body);
            div_element =  $('<div/>', {id:'popup'}).appendTo(div_outside);
            div_element.css({position: 'relative', bottom: 0, 'z-index': 10000});
            $.each(data, function(i,v){
                if(v && i){
                    div_wrapper =  $('<div/>', {'class': 'part'}).appendTo(div_element);
                    div = document.createElement('div');
                    span = document.createElement('span');
                    $(span).html(i).appendTo(div_wrapper);
                    $(div).html(v).appendTo(div_wrapper);
                }
            });
            close_button = $('<div/>', {'class':'close_popup', text: 'X'}).appendTo(div_wrapper);
        },
        error: function(data){
            alert('error');
        }
    })
});
$('.close_popup').click(function(){
    $('#wrapper').remove();
})

当我点击close_popup什么都没有执行，我认为它的原因是tag > close_popup不被jQuery选择器看到，如果是这样，如何添加它?也可能是我的错误

您需要使用事件委托为那些动态添加到DOM的元素附加事件:

$(document.body).on('click','.close_popup',function(){
    $('#wrapper').remove();
})

使用delegeate或on为动态创建的元素绑定事件。

$(document).delegate('.close_popup','click',function(){
    $('#wrapper').remove();
});

或

$(document).on('.close_popup','click',function(){
    $('#wrapper').remove();
});

但是使用。on总是更好。

  Try  select immediate parent which static on your html dom

$("#devices_wrapper").on("click",".close_popup",function(){
          $('#wrapper').remove();
    });
相关文章：