Question

你好我的JS救世主！我有另一个困境::我有一个标题为“homebanner”的div，其中包含文本和背景图像。我的客户决定让#homebanner在4张图片/幻灯片上重新加载。

所以，我这样做是为了改变背景::

JS CODE

jQuery(function($){
$('#homebanner').css({backgroundColor: "#fff"}); 
var totalCount = 4; 
var num = Math.ceil( Math.random() * totalCount );
function setBGImage() { 
var bgimage = 'http://bwpcommunications.com/TESTING/images/homepage/'+num+'.jpg';
$('#homebanner').css(
{
backgroundImage:"url("+bgimage+")",
}); 
} 
setBGImage(); 
});

它很棒！所以我对此很感兴趣。但我无法找到一种方法来让特定的标题文字与每张图片相对应。这可能吗？此外，这是指向测试网站http://www.bwpcommunications.com/TESTING/的链接。如您所见，当您刷新页面时，图像会发生变化，但文本却没有。

任何帮助都会很棒！

谢谢，

Shadna

Answer 1

将您想要的任何标题文字选项放入数组

var hText = ["blue jeans", "red jeans", "ripped jeans", "plaid"];

然后在设置背景图像后，您可以使用num变量从数组中选择相应的文本（或者如果您想随机选择，则可以再次执行随机数生成）。然后，只需在页面上设置文本即可。

$('#htxt').html(hText[num]);

或简单的javascript：

document.getElementById('htxt').innerHTML = hText[num];

根据图像的编号方式，您可能需要执行num - 1，因为数组是0索引。

我需要我的JQuery幻灯片在重新加载时更改div内容

1 个答案: