点击重新加载脚本
问题描述:
我尝试添加交互到我的滑块How to add a class to previous div点击重新加载脚本
脚本的第一部分负责更改类。如果将当前类放到另一个div中,则前面的div将会变为.prv,而当前div后面的div将变为.nxt
但是现在,当我将按钮功能添加到按钮(下一个)以删除当前类时, .nxt和.prv仍然存在,它们应该消失。请检查小提琴:https://fiddle.jshell.net/df9ef0hf/12/
<div class="next">next</div>
<div class="previous">prev</div>
<div class="main-slider">
<div class="slide current"></div>
<div class="slide "></div>
<div class="slide " ></div>
<div class="slide "></div>
<div class="slide "></div>
</div>
为
$(".main-slider").ready(function(){
$(".current").prev().addClass("prv");
$(".current").next().addClass("nxt");
if(! $(".current + div").length) $('.slide').first().addClass("nxt"); // current is last
if(! $(".current").prev().length) $('.slide').last().addClass("prv") // current is firs
});
$('.next').click(function() {
$('.current').removeClass('current');
});
UPDATE /工作拨弄 https://fiddle.jshell.net/df9ef0hf/15/
答
你不重新分配当前类,因此脚本不知道什么是当前对象是。试试这个:
var update = function() {
$(".current").prev().addClass("prv");
$(".current").next().addClass("nxt");
if(! $(".current + div").length) $('.slide').first().addClass("nxt"); // current is last
if(! $(".current").prev().length) $('.slide').last().addClass("prv") // current is firs
};
$(".main-slider").ready(function(){
update();
});
$('.next').click(function() {
$('.current').removeClass('current');
$(".nxt").addClass("current").removeClass("nxt");
update();
});
让我知道你是否需要我的答案任何帮助。 –