javascript - Jquery 从服务器删除后删除元素

Question

我正在研究从我的图库中删除图像的功能。在 PHP 方面它有效。使用 Jquery/Ajax 也可以。但是当我修改我的 jquery 以在图像被删除时删除元素(删除元素客户端)时它不再有效(当我说不再有效时它给我代码中内置的错误函数:

此代码有效:

function deleteImage(file_name)
{
    var r = confirm("Are you sure you want to delete this Image?")
    if(r == true)
    {
        $.ajax({
          method: "POST",
          url: '/images/gallery/deleteImage.php',
          data: {'delete_file' :  file_name },
          success: function (response) {
             ohSnap("Image has been deleted.", "green");
          },
          error: function () {
             ohSnap("An error has occured.", "red");
          }
        });
    }
}

但是这个没有

function deleteImage(file_name)
{
    var r = confirm("Are you sure you want to delete this Image?")
    if(r == true)
    {
        $.ajax({
          method: "POST",
          url: '/images/gallery/deleteImage.php',
          data: {'delete_file' :  file_name },
          success: function (response) {
             $('#' + file_name).remove();
             ohSnap("Image has been deleted.", "green");
          },
          error: function () {
             ohSnap("An error has occured.", "red");
          }
        });
    }
}

知道为什么添加删除函数会导致错误吗？在控制台中，它没有告诉我原因，所以我迷路了。

更新:

这是其中一个元素的示例:

<div class="thumbImage" id="happy_anime_s2-1433126427.png">
<a href="images/gallery/happy_anime_s2-1433126427.png" data-featherlight="image">
<img src="images/gallery/happy_anime_s2-1433126427.png" width="200px" alt="" />
</a>
<span class="deleteImage">
<input type="hidden" value="happy_anime_s2-1433126427.png" name="delete_file" id="delete_file" />
<input type="button" value="Delete image" onclick="deleteImage('happy_anime_s2-1433126427.png');"/>
</span>
</div>

Answer 1

问题是 .在 id 中，它创建了一个类选择器。看选择器#happy_anime_s2-1433126427.png ，它会查找 ID 为 happy_anime_s2-1433126427 的元素并且有一个类 png .

您需要转义 .使用 \\.喜欢

$('#' + file_name.replace('.', '\\.')).remove();

selectors

To use any of the meta-characters ( such as !"#$%&'()*+,./:;<=>?@[]^`{|}~ ) as a literal part of a name, it must be escaped with with two backslashes: \.