Javascript 使用jQuery中的开关按钮隐藏某些输入并显示其他输入

你好Stackoverflow社区，希望你做得很好，我想做的是当我点击开关按钮时，我希望它隐藏某些输入并显示其他输入，我的代码是一个添加学生和教师的表单，由于有cummon输入，我想在按下开关按钮时隐藏未共享的输入，当我再次单击它时，则执行相反的操作，但所有这些操作似乎都失败了，我只能隐藏一些输入，当我再次单击它时，它将不起作用，我所做的如下：

Jquery代码：

$(document).ready(function(){
    $('.teacher').hide();
    $('.switch').click(function(){
        $('.student').hide();
        $('.teacher').show();
    });
});

 <label>Student&nbsp;</label>
                                    <label class="switch">
                                      <input type="checkbox" id="switchVal" value="0">
                                      <span class="slider"></span>
                                    </label> 
                                    <label>&nbsp;Teacher</label>

HTML代码：

$(document).ready(function(){
    $('.teacher').hide();
    $('.switch').click(function(){
        $('.student').hide();
        $('.teacher').show();
    });
});

 <label>Student&nbsp;</label>
                                    <label class="switch">
                                      <input type="checkbox" id="switchVal" value="0">
                                      <span class="slider"></span>
                                    </label> 
                                    <label>&nbsp;Teacher</label>

学生
老师

$（'.teacher'）.hide（）；
$（'.switch'）。单击（函数（）{
$（'.student'）.toggle（）；
$（'.teacher'）.toggle（）；
});

学生
教师
使用
$（“.Teacher.student”）.toggle（）

或者，如果需要，对于更细粒度的控制，您可以始终使用

const isChecked=this.checked；//布尔值`

例如：


jQuery（$=>{
$（“.teacher”）.hide（）；
$（“#switchVal”）。打开（“输入”，函数（）{
$（“.teacher.student”）.toggle（）；
});
});
.toggler{
显示：内联flex；
间隙：0.5px；
光标：指针；
}
.toggler复选框{
显示：内联块；
宽度：35px；
高度：15px；
背景：#444；
边界半径：1.2米；
}
.toggler复选框：：之前{
内容：“；
位置：相对位置；
显示：内联块；
宽度：15px；
高度：15px；
背景：#0bf；
边界半径：1米；
转换：转换0.3s；
}
.toggler输入：选中~.toggler复选框：：之前{
转换：translateX（20px）；
}
.toggler标签{
用户选择：无；
}
.切换标签：第n个类型（1）{
顺序：-1；
颜色：#0bf；
}
.toggler输入：选中~。toggler标签：类型（1）的第n个{
颜色：继承；
}
.toggler输入：选中~。toggler标签：类型（2）的第n个{
颜色：#0bf；
}

学生
老师

学生：安娜
学生：约翰
老师：马克
学生：塔拉
老师：扎克

PS：不要仅仅为了有一些
标签而使用
Student
。那是无效的。标签应该包装一个动作输入元素或使用
for
属性指向其ID。啊，我明白了谢谢你sir谢谢你sir它起作用了谢谢你，谢谢你知道我知道什么是切换按钮