Question

我尝试进行Ajax调用以获取更多关于点击的数据。它在第一次点击时工作，但之后我不能再点击按钮了，我收到的数据也没有应用任何javascript（如bootstrap popover，lazyload img）。我已将JS放在底部（</body>标记之前）并且我认为这是问题所以我试图将js放在<head>标记中，但仍然没有＃39;解决问题。

我在stackoverflow上找到了像

这样的解决方案

$(document).on('click','.show_more',function(){
    // function
});

但这并没有解决它。这是我的js：

  $(document).on('click','.show_more',function(){
    var ID = $(this).attr('id');
    $('.show_more').hide();
    $('.loding').show();
    $.ajax({
        type:'POST',
        url:'load.php',
        data:'id='+ID,
        success:function(html){
            $('#show_more_main'+ID).remove();
            $('.item-list').append(html);
        }
    }); 
});

抱歉，如果我的英语不好，因为我是越南人。

Answer 1

只需确定问题在哪里检查按钮事件和ajax请求是否使用console.log（）。

 $(document).on('click','.show_more',function(){
            console.log("my button click works");
            var ID = $(this).attr('id');
            $('.show_more').hide();
            $('.loding').show();
            $.ajax({
                type:'POST',
                url:'load.php',
                data:'id='+ID,
                success:function(html){
                    console.log("my ajax request was successful")
                    $('#show_more_main'+ID).remove();
                    $('.item-list').append(html);
                }
            }); 
        });

Answer 2

clickEvent()();
function clickEvent() {
$(document).on('click','.show_more',function(){
var ID = $(this).attr('id');
$('.show_more').hide();
$('.loding').show();
$.ajax({
    type:'POST',
    url:'load.php',
    data:'id='+ID,
    success:function(html){
        $('#show_more_main'+ID).remove();
        $('.item-list').append(html);
        clickEvent();
    }
  }); 
});
}

ajax调用后，Javascript无法正常工作

2 个答案: