AJAX按钮触发页面上的所有按钮

时间:2019-04-24 23:00:46

标签: javascript jquery ajax

我有一个充满评论的模态。我的代码采用JSON数组,将第一个索引作为原始帖子发布,然后遍历其余部分作为回复,并为每个帖子创建AJAX侦听器。当我单击AJAX按钮时,只有原始帖子按钮起作用,而当我单击原始帖子上的按钮时,它似乎会触发4次(在我的示例中为答复数)。

enter image description here

我尝试移动AJAX侦听器的代码,并删除了原始帖子的AJAX侦听器,但它似乎仍然可以工作并多次触发。

这是我生成模型的函数...

function ShowCommentsModal (res)
        {

$('.modal').modal('show')    
//Set HTML for main comment here
$('.ModalPost').html(
    '<div id="Post"><div id="UserInfoDiv">// HTML CODE FOR ORIGINAL POST
        );
        // REMOVED CODE FOR REPOST AJAX HERE

//Set HTML for comments here
    res.shift();
    $('.CommentArea').html(''); // Clear HTML
    $.each(res, function(index) {    // Start of foreach loop            

$('.CommentArea').html(
     $('.CommentArea').html() +                                              
        // COMMENT HTML HERE
        )
     $('[data-likes]').click(function() {
    var buttonid = $(this).attr('data-likes');
        $.ajax({
        type: "POST",
        url: "api/likes?id=" + $(this).attr('data-likes'),
        processData: false,
        contentType: "application/json",
        data: '',
        success: function(r) {
           var res = JSON.parse(r)
            console.log(r)
            $("[data-likes... //update like button')
          },
        error: function(r) { console.log(r) }
        }); // END OF AJAX
    }); //END OF DATA-LIKES CLICK FUNCTION
        $('[data-comment]').click(function() {
                var buttonid = $(this).attr('data-comment');
              $.ajax({
                      type: "GET",
              url: "api/comments?postid=" + $(this).attr('data-comment'),
              processData: false,
              contentType: "application/json",
              data: '',
              success: function(r) {
                var res = JSON.parse(r)
            console.log(res)
            ShowCommentsModal.call(res);
            },
              error: function(r) { console.log(r) }
        }); //END OF AJAX
    }); //END OF COMMENT CLICK LIKE FUNCTION
}); //End of For Loop
} end of funcrion

生成按钮的代码

<button class="btn btn-primary" id="InteractButt" data-likes=“'+res[index].post_id+'“

按钮是动态生成的,我在其中放置了“ // COMMENT HTML HERE”

0 个答案:

没有答案