使用Ajax和jQuery刪除單個項目

Question

請我需要使用jQuery和Ajax從我的網站中刪除項目，但我不知道如何獲取要刪除的特定ID或更少，請參見以下示例：

HTML代碼

<span id="file-1">Orange</span> <a id="delete-1">Delete</a>
<span id="file-2">Orange</span> <a id="delete-2">Delete</a>
<span id="file-3">Orange</span> <a id="delete-3">Delete</a>
<span id="file-4">Orange</span> <a id="delete-4">Delete</a>
<span id="file-5">Orange</span> <a id="delete-5">Delete</a>
<!--Next item will have id of 6 is looping...-->

AJAX JQUERY

<script>
    $(document).ready(function(e){
        $("#delete-").click(function(){
//Am confused here how to know which id need to be deleted?
var id = $('#file-').val();
        $.ajax({
        url:'/delete_reply.php',
        data:'id='+id,
        type: "POST",
        beforeSend: function(){
        $('#comment-'+id'').attr('class', 'deleting');
        },
        success: function(data){
            $('#comment-'+id'').hide();
            $(#comment-'+id'').css('display','none'); 

        }
          });
          });
    });
</script>

請我不知道如何將要刪除的內容的ID傳遞給Ajax，有人可以幫助我嗎？

Answer 1

更新：

這是使用data屬性為HTML元素分配值的好方法。
對於該HTML和jQuery來說，它們都看起來像如下。

HTML：

<span id="file-3">Orange</span> <a data-fileid="3" class="cmnDeleteFile">Delete</a>

JQUERY

$(".cmnDeleteFile").click(function(e){
    e.preventDefault();

    var id=$(this).data('fileid');
    // This is how you get id of the file from same element using data attribute.

});

---

舊答案：

您使用的方法錯誤。 單擊每個鏈接，為每個鏈接提供通用的CSS類並觸發事件。

HTML：

<span id="file-3">Orange</span> <a id="3" class="cmnDeleteFile">Delete</a>

JQUERY

$(".cmnDeleteFile").click(function(e){
    e.preventDefault();

    var id=$(this).attr('id');
    // This is how you get id of the file from same element.

});

Answer 2

更換您的

var id = $('#file-').val();

與

var id=$(this).attr('id').split("-")[1];

順便說一句，我還沒有測試其余的代碼。 特別是用於綁定click事件的#delete-選擇器。