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; 
    } 
});