完成ajax请求后，Ajax achor变为正常的锚！

我正在使用以下Ajax函数发送请求。虽然有些奇怪的事情发生。请求完成后，返回的新按钮不会启用ajax。它充当了一个正常的锚点。完成ajax请求后，Ajax achor变为正常的锚！

$(document).ready(function() { 
    $(".UIButton a").click(function(e) { 
     e.preventDefault(); 

     if (! $(this).data("isClicked")) 
     { 
      var requestData = $(this).attr("href"); 
      var link = $(this); 

      $.ajax({ 
       context: this, 
       dataType: 'js', 
       url: requestData, 

       beforeSend: function() { 
        $(link).fadeOut("slow"); 
       }, 

       error: function() { 
       }, 

       success: function(response) { 
        $(link).parent().html(response); 
         $(link).stop().fadeIn("slow"); 
       } 
      }); 

      // Toggle isClicked to prevent button mashing 
      link.data("isClicked", true); 

      // Create timeout to restore button 
      setTimeout(function() { link.removeData("isClicked") }, 1000); 
     } 
    }); 
});

下面是来自服务器，这是正确的回： <a class="delete" href="https://stackoverflow.com/users/delete/3333">Delete</a>

原来这里是按钮：

<div class="UIButton"> 
    <a class="Add" href="https://stackoverflow.com/users/add/3333">Add</a> 
</div>

来源

2011-05-08 Mohamad

因为当您最初结合事件的链接并不存在听众click事件，您需要重新绑定事件（在成功函数中使用bind），或使用delegate或live将事件处理程序绑定到事件（推荐nded）。

使用delegate或live可确保现在和将来在匹配元素上处理事件。

这里是你将如何与delegate做到这一点：

$("containing-element-selector").delegate(".UIButton a", "click", function() { 
    ... 
});

（这是推荐的方法）

或者与live：

$(".UIButton a").live("click", function() { 
    .... 
});

来源

2011-05-08 21:52:36

这是因为.click()功能只会影响当前存在的DOM元素。请尝试使用.live("click", function() {your_function_here})代替。

有关更多信息，请参阅http://api.jquery.com/live/

来源

2011-05-08 21:54:31 Corkscreewe

完成ajax请求后，Ajax achor变为正常的锚！

回答

相关问题