jquery點擊動態元素

我有一個upvote帖子風格佈局在我的網站上，我有一個ajax請求加載更多的帖子，該代碼工作正常，但我的問題是當我嘗試upvote他們。那些不是從ajax請求中動態顯示的，可以是upvoted，但是當它加載更多時，它們不能被upvoted。jquery點擊動態元素

我有一個ID like_postID所以代碼可以檢查最後一條帖子是否被提高。

搜索我遇到$(document).on(eventName, selector, function(){});，我試了一下，它仍然有效，但只有那些沒有被ajax調用請求的。

繼承人我的HTML代碼：

<div class="contain"> 
    <div class="upvote-vetor"> 
    <a href="javascript:void(0)"><img alt="" src="images/upvotes.png" id="like_'.$post['id_post'].'" class="like"></a> 
    <p id="likes_'.$post['id_post'].'">'.$upvote['upvotes'].' Up Votes</p> 
</div>

繼承人我在我的Jquery：

$(document).ready(function(){ 

    // like and unlike click 
    $(".upvote-vetor").on("click",".like", function(){ 
     var id = this.id; // Getting Button id 
     var split_id = id.split("_"); 

     var text = split_id[0]; 
     var postid = split_id[1]; // postid 
     // Finding click type 
     var type = 1; 
     // AJAX Request 
     $.ajax({ 
      url: 'php/upvote.php', 
      type: 'post', 
      data: {postid:postid,type:type}, 
      dataType: 'json', 
      success: function(data){ 
       var likes = data['likes']; 

       $("#likes_"+postid).text(likes);  // setting likes 

      }, 
      error: function(data){ 
       alert("error : " + JSON.stringify(data)); 
      } 
     }); 
    }); 
});

PHP代碼給予好評：

$userid = $id_user; 
$postid = $_POST['postid']; 


// Check entry within table 
$query = "SELECT COUNT(*) AS upvotes FROM upvotes WHERE id_post='$postid' and id_user= '$userid'"; 

$result = $conn->prepare($query); 
$result->execute(); 
$fetchdata = $result->fetch(PDO::FETCH_ASSOC); 
$count = $fetchdata['upvotes']; 


if($count == 0){ 
    $insertquery = $conn->prepare("INSERT INTO `upvotes` (`id_upvote`, `id_user`, `id_post`) VALUES (NULL, '$id_user', '$postid');"); 
    $insertquery ->execute(); 
}else { 

    $updatequery = $conn->prepare("DELETE FROM `upvotes` WHERE id_user= '$userid' and id_post='$postid'"); 
    $updatequery->execute(); 
} 


// count numbers of like and unlike in post 
$query2 = "SELECT COUNT(*) AS upvotes FROM upvotes WHERE id_post='$postid'"; 
$result2 = $conn->prepare($query2); 
$result2->execute(); 
$fetchlikes = $result2->fetch(PDO::FETCH_ASSOC); 
$totalLikes = $fetchlikes['upvotes']. " Up Votes"; 


$return_arr = array("likes"=>$totalLikes); 

echo json_encode($return_arr);

在此先感謝。 :)

來源

2017-10-20 Ruben Perdigao

另外，我認爲在你的成功事件應該是'var likes = data.likes'它是一個JSON對象而不是數組。 – SaidbakR

@SaidbakR'data ['likes']'與'data.likes'同義＃ –

你能分享upvote.php代碼嗎？我只是好奇 - 因爲它似乎與ID不匹配或沒有正確生成有關，因爲您並未替換您附加的點擊偵聽器的對象以便開始（因此將偵聽器附加到父對象上真的不會影響它）。我希望看到的一件事是使用'postid'作爲你AJAX的變量名，但你的其他PHP顯示'id_post'。這也很難說，如果你的報價是正確的設置，因爲你顯示的PHP打印出的HTML，但也留下了一些PHP在那裏... –

您需要將偵聽器附加到已存在的父元素，以偵聽相關元素上的點擊。例如：

$('body').on('click','.upvote-vetor .like', my_function)

來源

2017-10-20 21:32:43

jquery點擊動態元素

回答

相關問題