在AJAX請求後鏈接不工作

Question

我對我正在製作的網頁有一個小問題，但相當惱人的問題。所以我有一個鏈接，當點擊時，向PHP腳本發出一個AJAX請求（鏈接發送一個隱藏的輸入值，如果有的話）。它工作正常，它按我的預期工作，但如果我再次嘗試點擊鏈接，它什麼都不會做。我必須刷新頁面才能使其重新工作，我寧願不必這樣做。

鏈接： <a name='delete-link' href='#'>Delete</a>

的JavaScript：

$("a[name='delete-link']").click(function(e){ 
     e.preventDefault(); 
     var ID = $(this).parents("ul").find("input[name='delete-identifier']").val(); 

     $.ajax({ 
      type: 'POST', 
      url: '../ajax.php', 
      data: {delete: 'true', delete_id: ID}, 
      success: function(response){ 
       $("#result").html(response).fadeIn(500).delay(5000).fadeOut(500); 
       $("div[name='update']").load("test.php #update"); 
      } 
     }) 
    }) 

在#UPDATE DIV唯一的代碼是這樣的PHP代碼呼應表顯示用戶：

<?php 
    if ($rs){ 
     $user_table = "<table class='table table-bordered table-condensed table-hover table-striped'><th>Action</th>"; 
     $user_table .= "<tr><th>Name</th><th>Privilege ID</th></tr>"; 
     while ($user = $rs->fetch_array(MYSQL_ASSOC)){ 
      $user_table .= "<td>". $rank['RankName'] ."</td><td>". $user['PrivilegeID'] ."</td><td>"; 
      $user_table .= "<td><div class='btn-group'> 
            <button type='button' class='btn btn-default dropdown-toggle' data-toggle='dropdown' aria-expanded='false'> 
            Action <span class='caret'></span> 
            </button> 
            <ul class='dropdown-menu' role='menu'> 
            <input type='hidden' name='delete-identifier' value='". $user['ID'] ."'> 
            <li><a name='delete-link' href=''>Delete</a></li> 
            </ul> 
           </div> 
          </td><tr>"; 
     } 
     $user_table .= "</table>"; 
     echo($user_table); 
    } 
?> 

任何想法？

Answer 1

ajax後你正在更新div，.click()不適用於動態加載的html。 使用.on()

$(document).on("click","a[name='delete-link']",function(e){ 
    e.preventDefault(); 
    var ID = $(this).closest("ul").find("input[name='delete-identifier']").val(); 

    $.ajax({ 
     type: 'POST', 
     url: '../ajax.php', 
     data: {delete: 'true', delete_id: ID}, 
     success: function(response){ 
      $("#result").html(response).fadeIn(500).delay(5000).fadeOut(500); 
      $("#update").load("test.php"); 
     } 
    }) 
}) 

在地方的$(document)您可以使用動態內容父的ID選擇爲$('#updateDivParentId')