jquery - 使用类名隐藏动态创建的 div

Question

我通过增加它们的类名来动态创建 div。现在我在 div 的右上角有一个关闭按钮，我希望在单击关闭按钮时隐藏一个特定的 div。

代码：

var i=1;
var newImageBoxdiv = $(document.createElement('div')).attr({ class:"demo"+i, id:"image"});
newImageBoxdiv.innerHTML = "<img id='MyImage' />";   
newImageBoxdiv.insertAfter('.demo');
i++;
$('#CloseWindow').click(function(){
?????
});

每次我创建一个div。我得到它的类名 demo1,demo2... 等等。我应该在#CloseWindow 函数中写什么来隐藏我想要的 div？

Answer 1

首先，当您创建 div 时，我会在 id 上使用增量器，而不是类，因为 id 是唯一的：

var newdiv = $('div id="demo' + i + '" class="demo">')

其次，您需要跳过图像标签中的 id，或者在那里使用相同的逻辑，因为我假设您创建了很多 div。

newdiv.append($('<img class="myimage" />')); //this will add myimage to end of newdiv

现在在 closewindow 中，您可以使用类名关闭。

$('#closewindow').click(function(){
    $('.demo').hide();
});

Answer 2

您必须添加一个.live()函数来确保点击绑定发生在动态生成的内容上。

$('#CloseWindow').live('click', function(){ 
    $(divSelector).hide();
});

Answer 3

$(divSelector).hide()将隐藏选定的元素

$(divSelector).show()将显示所选元素

$(divSelector).toggle()将在所选元素上显示/隐藏

希望这对你有帮助！