我有一组相关的图像,我希望能够通过点击不同的单选按钮来改变(但在同一个div中的位置)。
目前我正在使用数组来处理html,
var marketingImages = [image1HTML, image2HTML, image3HTML, image4HTML];
var salaryImages = [image1HTML, image2HTML, image3HTML, image4HTML];
当单击相关的单选按钮时,会运行一个函数来清除div中的html(可能是之前的图像),并使用.append加载新图像。
$(document).ready(function() {
$("#marketing, #salary").click(leed);
function leed() {
$("#portfolio-images").html("");
if ($("#marketing").is(':checked')) {
var portfolioArray = marketingImages;
} else if ($("#salary").is(':checked')) {
var portfolioArray = salaryImages;
}
for (var i=0; i<portfolioArray.length; i++) {
$("#portfolio-images").append(portfolioArray[i]);
}
...
}
它似乎运作良好,但作为一个菜鸟虽然我不得不怀疑是否有更好的方法来处理这个问题。从技术上讲,这些图像只是缩略图(可以点击以加载更大的Lightbox版本),但我不确定那些“真正”加载某人的效果如何。
有人知道是否有更好的方法来处理加载图像组?感谢。