Javascript jquery获得一个'；未定义'；关于div元素I'；我想抓住你

因此，我使用JavaScript动态生成HTML代码，从Firebase实时数据库加载所有图像。我目前正致力于实现一个附加到每个图像的按钮，当单击该按钮时，该按钮将删除此图像。但是，在多次尝试使用标准JavaScript和Jquery获取该div的ID属性后，警报框中的ID始终为“未定义”。检查网页可以让我看到，图像的id总是加载在刚刚好，所以我知道它在那里

响应我的html“onclick事件”的JavaScript函数

function deleteFile(){

var postId = $(this).closest('div').attr('id');
alert("You have selected id: " + postId);
var sure = confirm("Are you sure you want to delete this post?");
 if(sure){
    firebase.database().ref().child('Posts/' + postId).remove().then(function(){
        alert("Post deleted sucessfully");
      });
    }
  };

---

附加图像是在实际的chrome inspector上生成的html。ID当然都是唯一的。

将onclick与

$（此）

配对不会像您预期的那样工作，因为

$（此）

具有不同的上下文，您可以使用

控制台.log（$（此））查看其值

应该做的是向该按钮添加一个类，并通过jquery绑定onclick事件。运行下面的代码段


红色div包含通过jquery附加的onclick事件
黄色div包含附加到按钮属性onclick的onclick事件


$（文档）.ready（函数（）{
$（“.getIdButton”）。单击（函数（）{
警报（$（this）.closest（“div”）.attr（“id”）；
});
});
函数getId（）{
警报（$（this）.closest（“div”）.attr（“id”）；
log（$（this））；
}
div{
宽度：100px；
高度：100px；
填充：20px；
显示：内联块；
}
#红色的{
背景色：红色；
}
#黄色的{
背景颜色：黄色；
}

点击我
点击我
在html onclick属性上添加
此
参数，使其成为
deleteFile（this）

然后在你的js上

function deleteFile(element){
    var postId = $(element).closest('div').attr('id');
    alert("You have selected id: " + postId);
    var sure = confirm("Are you sure you want to delete this post?");
    if(sure){
        firebase.database().ref().child('Posts/' + postId).remove().then(function(){
            alert("Post deleted sucessfully");
        });
    }
};

所以，在实现了这段代码之后，什么也没发生，这对我来说完全有意义。没有错误，警报也不再弹出。@sazar97您使用的是什么类？我修改了jquery代码并将其放在document.ready（）中。您的内容必须是动态的，因此事件未在页面加载时附加。代码现在在您修改后运行。我在想，动态加载的代码一定是它没有被交互的原因。谢谢你！我的按钮有一个imageButton类，所以我在实现你的代码时使用了这个类。这正是我想要的，ID现在显示出来了，帖子可以被删除。非常感谢。