如何在jQuery中“淡出”和“删除”一个div ?

我试图给淡出效果的一个div &删除该div(id = "通知")，当图像被点击。

我是这样做的:

<a onclick="$("#notification").fadeOut(300,function() { $("#notification").remove(); });" class="notificationClose "><img src="close.png"/></a>

这似乎并不奏效。我要怎么做才能弥补呢?

当前回答

你真的应该尝试在一个单独的文件中使用jQuery，而不是内联。以下是你需要的:

<a class="notificationClose "><img src="close.png"/></a>

然后是页面底部的<script>标签或者外部JavaScript文件。

$(".notificationClose").click(function() {
    $("#notification").fadeOut("normal", function() {
        $(this).remove();
    });
});

其他回答

你试过这个吗?

$("#notification").fadeOut(300, function(){ 
    $(this).remove();
});

也就是说，使用当前的this上下文来定位内部函数中的元素，而不是id。我一直在用这个模式——它应该有用。

如果你在几个不同的地方使用它，你应该把它变成一个插件。

jQuery.fn.fadeOutAndRemove = function(speed){
    $(this).fadeOut(speed,function(){
        $(this).remove();
    })
}

然后:

// Somewhere in the program code.
$('div').fadeOutAndRemove('fast');

fadeOut(’slow’,this . remove);

试试这个:

<a onclick='$("#notification").fadeOut(300, function() { $(this).remove(); });' class="notificationClose "><img src="close.png"/></a>

我觉得你在“点击”的时候用的双引号让它不起作用。：）

编辑:正如下面所指出的，内联javascript是邪恶的，你应该把它从onclick中移到jQuery的click()事件处理程序中。这就是现在的酷孩子们的做法。

Use

.fadeOut(360).delay(400).remove();

推荐文章