我想div在单击时显示和隐藏一些内容,并设法实现其中的一部分(当我单击相应的按钮时,它会显示div并隐藏它们)。
但是,当我单击其他按钮时,我不知道如何关闭所有已打开的div。例如,如果我单击“添加”按钮并打开相应的div,而当我单击“编辑”时,我想打开“编辑” div并关闭“添加” div。
我相关的HTML
<div id="controls">
<input type="button" class="addBtn" value="Add" id="add"/>
<input type="button" class="editBtn" value="Edit" id="edit"/>
<input type="button" class="viewBtn" value="View" id="view"/>
<input type="button" class="deleteBtn" value="Delete" id="delete"/>
</div>
<div id="test1">test 1</div>
<div id="test2">test 2</div>
<div id="test3">test 3</div>
Run Code Online (Sandbox Code Playgroud)
我的JS:
$(document).ready(function(){
$("#add").click(function(){
$("#test1").slideToggle("fast");
});
$("#edit").click(function(){
$("#test2").slideToggle("fast");
});
$("#view").click(function(){
$("#test3").slideToggle("fast");
});
});
Run Code Online (Sandbox Code Playgroud)
感谢您的建议和提示。