jQuery的刪除功能

Question

我試圖讓jQuery的刪除功能，這裏是代碼，我寫 -

$("a.delete").click(function(){   
     var target = $(this).attr("id");    
     var c = confirm('Do you really want to delete this category?'); 
     if(c==true) { 
    $(target+"ul").delay(3000).fadeOut(200); 
    } 
    else { 
    return false; 
    } 
    }); 

好現在的問題，當我按下，用類按鈕刪除，它正確，顯示對話框（和id是正確的），但是當我按下yes後，它會用php刪除它，沒有jquery fadeOut效果。 我的PHP代碼 -

public function deleteCategory() { 
    if(isset($_GET['action']) && $_GET['action'] == 'delete') { 
     $id = (int)$_GET['id']; 
     $sql = "DELETE FROM `categories` WHERE `id` = '".$id."'"; 
     mysql_query($sql); 
    } 
    } 

不知道哪裏出了問題，但我認爲這是在$（目標+「UL」），因爲我不知道，這是否會增加目標值和UL在一起。

另外，如果按否，我該如何防止刪除？目前，如果我按否，它仍然會刪除該類別。

如果您需要任何其他信息 - 問。

全碼 -

public function showCategories() { 
    if(isset($_SESSION['logged_in']) && isset($_SESSION['user_level']) && $_SESSION['user_level'] == 'admin') { 
     $sql = "SELECT * FROM `categories`"; 
     $q = mysql_query($sql); 
     if(mysql_num_rows($q) > 0) { 
     ?> 
      <div class="recentorders" style="display: none;" id="categoryBox"> 
      <h5 class="colr">Categories</h5> 
       <div class="account_table" style="width: 688px;"> 
        <ul class="headtable" style="width: 680px;"> 
         <li class="order">ID</li> 
         <li class="action" style="width: 430px;">Category Name</li> 
         <li class="action nobordr">Options</li> 
        </ul> 
     <?php 
     while($row = mysql_fetch_array($q)) { 
      ?> 
      <ul class="contable" style="width: 680px;" id="cat<?php echo $row['id']; ?>ul"> 
       <li class="order"><?php echo $row['id']; ?></li> 
       <li class="action" style="width: 430px;"><?php echo $row['name']; ?></li> 
       <li class="action nobordr"><a href="?action=edit&id=<?php echo $row['id']; ?>#" class="first">Edit</a><a class="delete" id="cat<?php echo $row['id']; ?>" href="?action=delete&id=<?php echo $row['id']; ?>#">Delete</a></li> 
      </ul>   
      <?php 
     } 
     ?> 
       </div> 
      </div> 
     <?php 
     } 
     else { 
     // No categories created, please create one first. 
     } 
    } 
    else { 
     header('location: account.php'); 
    } 
    } 

    public function deleteCategory() { 
    if(isset($_GET['action']) && $_GET['action'] == 'delete') { 
     $id = (int)$_GET['id']; 
     $sql = "DELETE FROM `categories` WHERE `id` = '".$id."'"; 
     mysql_query($sql); 
    } 
    } 

Answer 1

如果你通過，你需要用「＃」前綴您選擇ID搜索：

上的jsfiddle

100％的工作樣品：

http://jsfiddle.net/E7QfY/

變化

$(target+"ul").delay(3000).fadeOut(200); 

到

$('#' + target+"ul").delay(3000).fadeOut(200); 

OR

$(this).closest('ul').delay(3000).fadeOut(200); 

我還要修改代碼以這樣的：

$("a.delete").click(function(event){   
     if(confirm('Do you really want to delete this category?') == true){    
      $(this).closest('ul').delay(3000).fadeOut(200); 
      window.location.href = $(this).attr('href'); //OR use AJAX and do an event.preventDefault(); 
     } 
     else 
      event.preventDefault(); 
}); 

Answer 2

這是因爲你使用的是導致回發到，讓您的頁面刷新看到動畫之前服務器的錨標記。確保您的定位標記將href定義爲「＃」以停止回發。

Answer 3

您應該使用別的東西比A標籤例如跨度或分區。然後單擊此元素讓你淡出後後重定向到該刪除您對象的PHP腳本：

$("SPAN,DIV.delete").click(function(){   
    var target = $(this).attr("id");    
    var c = confirm('Do you really want to delete this category?'); 
    if(c==true) { 
     $(target+"ul").delay(3000).fadeOut(200); 
     window.location.href = URL TO PHP FILE 
    } 
    else { 
     return false; 
    } 
});