gpt4 book ai didi

jquery - 使用 JQuery 动态更改图像链接

转载 作者:行者123 更新时间:2023-11-27 22:56:07 25 4
gpt4 key购买 nike

在下面的代码中,我尝试以动态方式更改图像。效果很好,但是我也想更改连接到每个图像动态的链接,但我不太确定如何让它工作

$(function() {
var dataArray = new Array();
dataArray[0] = "img1.jpg";
dataArray[1] = "img2.jpg";
dataArray[2] = "img3.jpg";
dataArray[3] = "img4.jpg";
dataArray[4] = "img5.jpg";

var thisId = 0;

window.setInterval(function() {
$('#charityimgSizer').attr('src', dataArray[thisId]);
thisId++;
if (thisId == 5) thisId = 0;
}, 3000);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a id="imageLink3" href="www.link4.com">
<img id="charityimgSizer" src="img4.jpg" style="width: 300px" class="rewardImgSize alignright notopmargin pulse animated" alt="hexagon" title="hexagon" data-animate="pulse">
</a>

我需要一些帮助,请。例如,当图像为 img2.jpg 时,如何将 $('#imageLink3') 上的链接更改为 href link2.com

最佳答案

找到 a 标签(您为 img 所做的方式)并使用 .attr('href', '...') 设置链接 url。

$(function() {
var dataArray = new Array();
dataArray[0] = "img1.jpg";
dataArray[1] = "img2.jpg";
dataArray[2] = "img3.jpg";
dataArray[3] = "img4.jpg";
dataArray[4] = "img5.jpg";

var thisId = 0;

window.setInterval(function() {
// add this
$('#imageLink3').attr('href', grabLinkFromSomewhere());
$('#charityimgSizer').attr('src', dataArray[thisId]);
thisId++;
if (thisId == 5) thisId = 0;
}, 3000);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a id="imageLink3" href="www.link4.com">
<img id="charityimgSizer" src="img4.jpg" style="width: 300px" class="rewardImgSize alignright notopmargin pulse animated" alt="hexagon" title="hexagon" data-animate="pulse">
</a>

例如

$(function() {
var dataArray = new Array();
dataArray[0] = "img1.jpg";
dataArray[1] = "img2.jpg";
dataArray[2] = "img3.jpg";
dataArray[3] = "img4.jpg";
dataArray[4] = "img5.jpg";

const links = [
'https://stackoverflow.com?id=1',
'https://stackoverflow.com?id=2',
'https://stackoverflow.com?id=3',
'https://stackoverflow.com?id=4',
'https://stackoverflow.com?id=5',
];

var thisId = 0;

window.setInterval(function() {
// add this
$('#imageLink3').attr('href', links[thisId]);
$('#charityimgSizer').attr('src', dataArray[thisId]);
thisId++;
if (thisId == 5) thisId = 0;
}, 3000);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a id="imageLink3" href="www.link4.com">
<img id="charityimgSizer" src="img4.jpg" style="width: 300px" class="rewardImgSize alignright notopmargin pulse animated" alt="hexagon" title="hexagon" data-animate="pulse">
</a>

关于jquery - 使用 JQuery 动态更改图像链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55726053/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com