jquery this动画化了这个没有id的元素

jquery this animate this element without id

本文关键字：id 元素 this 动画 jquery      更新时间：2023-09-26

在我的HTML代码中，我有一个div。这个div包括一些对用户的警告。警告被包装在没有ID的div元素中。如果用户单击关闭按钮，它应该删除警告div。

<div id="alarmbox" align="center">
      <div>this is warning 1<button onclick="remove_div_of_this_button(this);">x</button></div>
      <div>this is warning 2<button onclick="remove_div_of_this_button(this);">x</button></div>
</div>

这是我的JS代码：

function remove_div_of_this_button(thisbutton)
{
    thisbutton.parentNode.parentNode.removeChild(thisbutton.parentNode);
}

它运行良好。但是，删除元素最好设置动画，而不是突然删除。如果我只想操作JS，如何用jquery删除div？是否可以在jquery中识别thisbutton，因为$（thisbutton）不应该在这里工作？

将js从html中分离出来，并将click事件与jquery一起使用。

带有淡出

$(function(){
    $('#alarmbox button').click(function () {
        $(this).closest('div').fadeOut(1000,function(){
            $(this).remove();
        });
    });
});

Demo

或者尝试向上滑动

Demo2

也许是这样？

function remove_div_of_this_button(thisbutton)
{
    $(thisbutton).parent().fadeOut(function() {
        $(this).remove();
    });
}
相关文章：