对不起,我提前编辑了格式,因为我已经很久没有提问了。我会尽力遵守所有规则。
所以我有这个列表,它像图像轮播一样工作:
<div class="carousel">
<ul>
<li class="past"><img src="img1.png"/></li>
<li class="past"><img src="img2.png"/></li>
<li class="current"><img src="img3.png"/></li>
<li class="future"><img src="img4.png"/></li>
<li class="future"><img src="img5.png"/></li>
</ul>
</div>
每当我点击一张图片时,点击的元素的类名将更改为“current”,我将翻译X <ul>
使“当前”<li>
看起来“居中”。所有这些都在“轮播”中 <div>
.
但是我有另一个 div,它有一个空屏幕 iPhone 模型的背景:
<div class = "iphone_screen">
<div>
<img class="display" src="blank_screen.png"/>
</div>
</div>
我想对“iPhone”执行此操作<div>
:
var imgUrl = $("body").find(".current").find('img').attr('src');
$(".display").attr('src',imgUrl);
但是这个 jQuery 只会在我加载页面时执行一次。
那么,每当我点击其中一个 <li>
时,如何再次执行我的 jQuery 代码?元素并制作类(class)名称current
改变?
更新:谢谢大家的回复!感觉好傻。。。。。不知道为什么问这个问题。。。。。我之前加了一个点击功能,但是没有用。然后我开始寻找替代方案。现在想想,选择器肯定是错的。
最佳答案
由于驱动一切的事件来自对 li
的点击,您可以对任何 li
的点击运行(在 ul
内) code>) 在分类为 div
的轮播中。
$(".carousel > ul > li").click(function () {
var imgUrl = $("body").find(".current").find('img').attr('src');
$(".display").attr('src',imgUrl);
});
关于javascript - 如何在类名更改时再次执行js代码?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39379362/