Javascript 幻灯片箭头上的活动状态

我正在尝试添加一个类，当滑块处于活动状态时，箭头应该处于活动状态。例如，如果有5个图像，并且用户移动到第二个图像，则左箭头应删除禁用的类

因此，两个箭头现在都将处于活动状态以向左或向右移动。如果用户到达第5张图像，则右侧的箭头被禁用

这似乎不起作用——有谁能给我一个建议，让我继续前进

$（'#product gallery super'）。子项（）。单击（函数（e）{
e、 预防默认值（）；
var prodImg=$（this.attr（'data-image'）；
var imgSrc=$（this.children（）.attr（'src'））
如果（imgSrc！='/images/imagecomingsoon_en.jpg'）{
$（this）.addClass（“活动缩略图”）.sides（）.removeClass（“活动缩略图”）；
$（'.main image'）.attr（'src'，prodImg）；
}
});
$（“#prev”）。单击（函数（）{
if（$（“#产品库超级.活动缩略图”）.prev（）.length！=0）{
$（“#产品库超级.活动缩略图”）.prev（）.addClass（“活动缩略图”）.next（）.removeClass（“活动缩略图”）；
$（'.main image'）.attr（'src'，$（'product gallery super'）.find（'.active缩略图'）.data（'image'））；
}
返回false；
});
$（“#下一步”）。单击（函数（）{
if（$（“#产品库超级.活动缩略图”）.next（）.length！=0）{
$（“#产品库超级.活动缩略图”）.next（）.addClass（'active-thumboil'）.prev（）.removeClass（'active-thumboil'）；
$（'.main image'）.attr（'src'，$（'product gallery super'）.find（'.active缩略图'）.data（'image'））；
}
返回false；
});
。活动缩略图{
显示：内联块；
边框：1px纯黑；
}
#上{
不透明度：1；
}
#先前禁用{
不透明度：0.5；
}
#下一个{
不透明度：1；
}
#下一个是残疾人{
不透明度：0.5；
}

上
下一个
我认为最好看到您的代码在运行。。试着让JSFIDLE。。当你这么做的时候，我没有在你的code@Mohamed-您无需创建JSFIDLE，只需向下滚动堆栈溢出并运行代码段即可。删除该类是可以的，但通过children（）确定第一个和最后一个。长度是导致问题的原因。对此，我深表歉意。。您只需要使用.index（）+1。。因此，如果活动图像的.index（）+1>1，则从“上一步”按钮中删除禁用的类，只需将+1添加到index（）中即可。index（）从0开始@SophieRhodes？@Mohamed Yousef工作得很好！！！谢谢你：）！我认为最好看到你的代码在运行。。试着让JSFIDLE。。当你这么做的时候，我没有在你的code@Mohamed-您无需创建JSFIDLE，只需向下滚动堆栈溢出并运行代码段即可。删除该类是可以的，但通过children（）确定第一个和最后一个。长度是导致问题的原因。对此，我深表歉意。。您只需要使用.index（）+1。。因此，如果活动图像的.index（）+1>1，则从“上一步”按钮中删除禁用的类，只需将+1添加到index（）中即可。index（）从0开始@SophieRhodes？@Mohamed Yousef工作得很好！！！谢谢你：）！