为什么状态问题不显示？我正在使用切换键在无问题和问题之间切换，但由于某种原因，我无法找出问题未显示的原因。
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#btn").on('click', function(){
$("#No_Issue").toggle();
$("#Issue").toggle();
})
})
</script>
<style>
#No_Issue{
display: block
}
#Issue{
display: none
}
</style>
<body>
<!-- ******************************************Refresh************************************* -->
<meta http-equiv="Refresh" content="60">
<!-- ******************************************BUTTON************************************* -->
<button id="btn" type="button"value= "edit">Switch Status</button>
<p>
<!--/************************************** No Issue Style***********************************/ -->
<div id ="No_Issue" style=" text-align:center;margin-
top:15px; margin-bottom:5px; max-
width:605px;">
<div id="No_stu" style="float:left; width:48%;">
<p style="border-bottom:1px solid black; height:80px">
<img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b0/Stop_hand_nuvola_orange.svg/240px- Stop_hand_nuvola_orange.svg.png"
style="width: 45px; height: 45px; margin-left: 5px; margin-right: 5px">
<Strong><font size="6">Status: No Issue</font></Strong>
</p>
</div>
<!--//**************************************Issue Style*********************************** -->
<div id ="Issue" style=" text-align:center;margin-
top:15px; margin-bottom:5px; max-
width:605px;">
<div id="stu" style="float:left; width:48%;">
<p style="border-bottom:1px solid black;padding-
bottom:10px;"><strong><font size="6">Student Portal</font></strong></p>
<p style="border-bottom:1px solid black; height:80px">
<img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b0/Stop_hand_nuvola_orange.svg/240px- Stop_hand_nuvola_orange.svg.png"
style="width: 45px; height: 45px; margin-left: 5px; margin-right: 5px">
<Strong><font size="6">Status: Issue</font></Strong>
</p>
</div>
</body>
</html>最佳答案
您已关闭 <div id ="No_stu">标签但您忘记关闭 <div id ="No_Issue">这就是 HTML 解析器处理你的 <div id="Issue"> 的原因节点作为 <div id ="No_Issue"> 的子节点并且它在切换时与其父级一起隐藏。
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#btn").on('click', function(){
$("#No_Issue").toggle();
$("#Issue").toggle();
})
})
</script>
<style>
#No_Issue{
display: block
}
#Issue{
display: none
}
</style>
<body>
<!-- ******************************************Refresh************************************* -->
<meta http-equiv="Refresh" content="60">
<!-- ******************************************BUTTON************************************* -->
<button id="btn" type="button"value= "edit">Switch Status</button>
<p>
<!--/************************************** No Issue Style***********************************/ -->
<div id ="No_Issue" style=" text-align:center;margin-
top:15px; margin-bottom:5px; max-
width:605px;">
<div id="No_stu" style="float:left; width:48%;">
<p style="border-bottom:1px solid black; height:80px">
<img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b0/Stop_hand_nuvola_orange.svg/240px- Stop_hand_nuvola_orange.svg.png"
style="width: 45px; height: 45px; margin-left: 5px; margin-right: 5px">
<Strong><font size="6">Status: No Issue</font></Strong>
</p>
</div>
</div>
<!--//**************************************Issue Style*********************************** -->
<div id ="Issue" style=" text-align:center;margin-
top:15px; margin-bottom:5px; max-
width:605px;">
<div id="stu" style="float:left; width:48%;">
<p style="border-bottom:1px solid black;padding-
bottom:10px;"><strong><font size="6">Student Portal</font></strong></p>
<p style="border-bottom:1px solid black; height:80px">
<img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b0/Stop_hand_nuvola_orange.svg/240px- Stop_hand_nuvola_orange.svg.png"
style="width: 45px; height: 45px; margin-left: 5px; margin-right: 5px">
<Strong><font size="6">Status: Issue</font></Strong>
</p>
</div>
</body>
</html>关于javascript - 为什么状态问题不显示？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52842878/