Javascript 根据选中的单选按钮显示幻灯片

我有一个滑块，里面有6个滑块。我的目标是，如果选中单选按钮id=“male”，则只显示3张第一张幻灯片，如果当前选中id=“male”按钮，则显示3张最后一张幻灯片。我尝试过将阵列对半拼接，并根据选中的按钮设置幻灯片索引，但没有效果。以下是我的HTML代码：

函数skinSlider（）{
设slideIndex=1，
female=document.getElementById（'female'），
male=document.getElementById（'male'），
skinSlider=document.GetElementsByCassName（'skin'）[0]，
skinSliderItem=document.getElementsByClassName（'skin-color'），
prev=skinSlider.querySelector（'.prev'），
next=skinSlider.querySelector（'.next'）；
放映幻灯片（幻灯片索引）；
函数加滑块（n）{
放映幻灯片（幻灯片索引+=n）；
}
上一个addEventListener（'单击'，（）=>{
加滑块（-1）；
});
next.addEventListener（'click'，（）=>{
加滑块（1）；
});
功能演示幻灯片（n）{
//如果（内螺纹检查和滑动索引<4）{
//滑动指数=4；
// }
如果（n>skinSliderItem.length）{
slideIndex=1；
}
if（n<1）{
slideIndex=skinSliderItem.length；
}
for（设i=0；i

男性
女性
选择肤色
我认为这基本上完成了您想要的。不幸的是，滑块向右移动时会“缠绕”，向左移动时会在下限处停止。但我将把这作为一个额外的挑战留给你。：-）


函数skinSlider（）{
设slideIndex=1，
female=document.getElementById（'female'），
male=document.getElementById（'male'），
skinSlider=document.GetElementsByCassName（'skin'）[0]，
skinSliderItem=document.getElementsByClassName（'skin-color'），
prev=skinSlider.querySelector（'.prev'），
next=skinSlider.querySelector（'.next'）；
放映幻灯片（幻灯片索引）；
函数加滑块（n）{
放映幻灯片（幻灯片索引+=n）；
}
上一个addEventListener（'单击'，（）=>{
加滑块（-1）；
});
next.addEventListener（'click'，（）=>{
加滑块（1）；
});
female.addEventListener（'click'，（）=>{
放映幻灯片（幻灯片索引）；
});
male.addEventListener（'click'，（）=>{
放映幻灯片（幻灯片索引）；
});
功能演示幻灯片（n）{
如果（slideIndex>skinSliderItem.length）{
slideIndex=1；
}
如果（滑动索引<1）{
slideIndex=skinSliderItem.length；
}
如果（内螺纹检查和滑动索引<4）{
滑动指数=4；
}else if（male.checked&&slideIndex>3）{
slideIndex=1；
}
for（设i=0；i

男性
女性
选择肤色
1.
2.
3.
4.
5.
6.
我认为这基本上完成了您想要的。不幸的是，滑块向右移动时会“缠绕”，向左移动时会在下限处停止。但我将把这作为一个额外的挑战留给你。：-）


函数skinSlider（）{
设slideIndex=1，
female=document.getElementById（'female'），
male=document.getElementById（'male'），
skinSlider=document.GetElementsByCassName（'skin'）[0]，
skinSliderItem=document.getElementsByClassName（'skin-color'），
prev=skinSlider.querySelector（'.prev'），
next=skinSlider.querySelector（'.next'）；
放映幻灯片（幻灯片索引）；
函数加滑块（n）{
放映幻灯片（幻灯片索引+=n）；
}
上一个addEventListener（'单击'，（）=>{
加滑块（-1）；
});
next.addEventListener（'click'，（）=>{
加滑块（1）；
});
female.addEventListener（'click'，（）=>{
放映幻灯片（幻灯片索引）；
});
male.addEventListener（'click'，（）=>{
放映幻灯片（幻灯片索引）；
});
功能演示幻灯片（n）{
如果（slideIndex>skinSliderItem.length）{
slideIndex=1；
}
如果（滑动索引<1）{
slideIndex=skinSliderItem.length；
}
如果（内螺纹检查和滑动索引<4）{
滑动指数=4；
}else if（male.checked&&slideIndex>3）{
slideIndex=1；
}
for（设i=0；i

男性
女性
选择肤色
1.
2.
3.
4.
5.
6.
在
HTML
部分中，哪些元素定义了幻灯片以显示是否选中了男性和女性？有两个id为“男性”和“女性”的输入，如果选中了“女性”输入，则滑块中只有最后3个项目可用，反之亦然。滑块是什么``HTML`元素？！使用类skin进行Div。在
HTML
部分中，哪些元素定义幻灯片以显示是否选中了男性和女性？有两个id为“男性”和“女性”的输入，如果选中了“女性”输入，则滑块中只有最后3个项目可用，反之亦然。滑块是什么``HTML`元素？！有阶级皮肤的Div。