jquery點擊事件重複

當用戶點擊取消關注按鈕，併成功結束請求，我改變了我的按鈕是一個按鈕，它仍然在聽取消跟蹤功能！看到下面的代碼jquery點擊事件重複

$(document).ready(function() { 
    $("button[data-follow]").on("click",function(){ 

var id = $(this).attr("data-follow"); 
$.ajax({ 
    data: {followid : id } , 
    url:"follow.php", 
    type:"POST", 
    datatype: "json", 
    success: function(data){ 
     alert(data); 
     $(this).css({"background" : "green"}); 



    } 
});}); 





$("button[data-unfollow]").on("click",function(){ 
var there = $(this); 
var id = there.attr("data-unfollow"); 
    $.ajax({ 
    data: {followid : id } , 
    url:"unfollow.php", 
    type:"POST", 
    success: function(data){ 
     alert(data); 
     there.text("follow"); 
     there.attr("data-follow","1234"); 



    } 
}); 



    }); 

     });

當我點擊按照它應該發送請求跟隨url，但它仍然發送到取消關注！

來源

2014-12-05 Waleed Kasem

提供您的html也 – 2014-12-05 12:53:53

button取消關注 – 2014-12-05 12:56:20

嗯，通常與委派的事件綁定，你希望父母與參數中的選擇器。即$（「＃your parent div」）。on（「button [data-follow]」，「click」，function ...等 – 2014-12-05 12:57:01

您必須刪除 '數據取消關注' 屬性在這樣的Ajax響應，

$("button[data-unfollow]").on("click",function(){ 
    var there = $(this); 
    var id = there.attr("data-unfollow"); 
    $.ajax({ 
    data: {followid : id } , 
    url:"unfollow.php", 
    type:"POST", 
    success: function(data){ 
     alert(data); 
     there.text("follow"); 
     there.attr("data-follow","1234"); 
     there.removeAttr('data-unfollow'); // try removing the data-unfollow attribute 
    } 
});

:::::::::::::::::::::: ::::::編輯:::::::::::::::::::::::::::::::::::::::::

將您的第一行JS代碼更改爲thism其工作......

$(document).on("click","button[data-follow]",function(){

和

$(document).on("click","button[data-unfollow]",function(){

並且不要忘記使用.removeAttr（）。

來源

2014-12-05 12:58:53 Pankaj

這不會解除以前的點擊處理程序 – 2014-12-05 12:59:25

嗯，不工作以及：？ – 2014-12-05 13:02:43

請檢查我已編輯的答案現在... – Pankaj 2014-12-05 13:11:33

使用.prop API添加的屬性和.removeProp API來刪除一個屬性

$(function(){ 

     $('button').on('click',function(e){ 
      $(this).removeProp('data-unfollow'); 
      $(this).prop('data-follow','Ok'); 
      alert($(this).prop('data-follow')); 
     }); 

    });

希望它可以幫助...

來源

2014-12-05 13:01:27 Mayank

通常與委託事件綁定你想選擇的父參數。

例如

$("#your parent div").on("click", "button[data-follow]", function() 
{ function contents here });

這是因爲家長需要注意DOM的變化。

來源

2014-12-05 14:10:56

jquery點擊事件重複

回答

相關問題