1

我正在通过 API 调用将图像和图像标题加载到 DOM，例如

var html = '';
var i=0, length=data.length, image;
for(; i<length; i++) {
html += '<li>';
html += '<div class="holder">';
html += '<div class="image"><img src="/path/to/image.jpg"></div>';
html += '<div class="imgTitle">Image title</div>';
html += '</div>';
html += '</li>';
}

$('#images').append(html);

我将此限制为 10，然后单击按钮加载下一个 10。标准的东西。

现在，点击一个不同的按钮，我想隐藏文本并只显示图像，或者再次点击，比如

$('#txtHide').click(function() {
    $('.imgTitle').toggle();
});

哪个对第一组图像很有用，但我需要为所有未来附加到 DOM 的状态保留状态，这可能吗？

因此，接下来的 10 个图像被加载并且 DOM 知道当前状态，例如类.imgTitle是否隐藏，并且所有未来的切换按钮点击都会影响 DOM 中的所有 div。

4

1 回答 1

1

您可以添加一个类#images并在该类存在时使用 CSS 隐藏其中的所有.imgTitles，而不是切换单个图像。

然后，您可以简单地调用.toggleClass().

于 2013-03-25T20:08:45.343 回答