【发布时间】：2021-06-21 01:05:32
【问题描述】：
所以我已经使用 SQL Server 将所有问题和答案存储在表中。 它完美地获取了所有问题的答案。 下面的图片链接是我的实际常见问题解答用户界面，所有问题都从表中正确获取。 https://i.stack.imgur.com/tlhtU.png 当点击 1 个问题时，它会在问题下方切换并显示答案。 https://i.stack.imgur.com/gZw2N.png 但是当我点击 2 个问题时会出现实际问题，它会切换或将我引导到第一个问题的答案而不是显示它的答案。
设计页面代码如下
<section class="faq-section">
<div class="container">
<div class="row">
<!-- ***** FAQ Start ***** -->
<div class="col-md-6 offset-md-3">
<div class="faq-title text-center pb-3">
<h2>FAQ</h2>
</div>
</div>
<div class="col-md-6 offset-md-3">
@foreach (var item in Model)
{
<div class="faq" id="accordion">
<div class="card">
<div class="card-header" id="faqHeading-1">
<div class="mb-0">
<h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-1" data-aria-expanded="true" data-aria-controls="faqCollapse-1">
<span class="badge"></span>@item.FAQ_question
</h5>
</div>
</div>
<div id="faqCollapse-1" class="collapse" aria-labelledby="faqHeading-1" data-parent="#accordion">
<div class="card-body">
<p> @item.FAQ_answer</p>
</div>
</div>
</div>
</div>
}
</div>
</div>
</div>
</section>
并且 下面的代码是查看源页面代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FaqList - My ASP.NET Application</title>
<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/site.css" rel="stylesheet"/>
<script src="/Scripts/modernizr-2.8.3.js"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">Application name</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="/">Home</a></li>
<li><a href="/FAQ/Faq1">AddFAQ</a></li>
<li><a href="/Home/Contact">Contact</a></li>
<li><a href="/FAQ/FaqList">FaqList</a></li>
</ul>
</div>
</div>
</div>
<link href="/Content/FAQstylesheet.css" rel="stylesheet" type="text/css" />
<h2>FaqList</h2>
<section class="faq-section">
<div class="container">
<div class="row">
<!-- ***** FAQ Start ***** -->
<div class="col-md-6 offset-md-3">
<div class="faq-title text-center pb-3">
<h2>FAQ</h2>
</div>
</div>
<div class="col-md-6 offset-md-3">
<div class="faq" id="accordion">
<div class="card">
<div class="card-header" id="faqHeading-1">
<div class="mb-0">
<h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-1" data-aria-expanded="true" data-aria-controls="faqCollapse-1">
<span class="badge"></span>How to reset Password?
</h5>
</div>
</div>
<div id="faqCollapse-1" class="collapse" aria-labelledby="faqHeading-1" data-parent="#accordion">
<div class="card-body">
<p> Click on Forget Password button and Enter new password and click on reset. </p>
</div>
</div>
</div>
</div>
<div class="faq" id="accordion">
<div class="card">
<div class="card-header" id="faqHeading-1">
<div class="mb-0">
<h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-1" data-aria-expanded="true" data-aria-controls="faqCollapse-1">
<span class="badge"></span>How to do Registration?
</h5>
</div>
</div>
<div id="faqCollapse-1" class="collapse" aria-labelledby="faqHeading-1" data-parent="#accordion">
<div class="card-body">
<p> vjjkegenve </p>
</div>
</div>
</div>
</div>
<div class="faq" id="accordion">
<div class="card">
<div class="card-header" id="faqHeading-1">
<div class="mb-0">
<h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-1" data-aria-expanded="true" data-aria-controls="faqCollapse-1">
<span class="badge"></span>How to do Assesment?
</h5>
</div>
</div>
<div id="faqCollapse-1" class="collapse" aria-labelledby="faqHeading-1" data-parent="#accordion">
<div class="card-body">
<p> cbwkc bckjbckwc kbvkjcvkwc kbckwjbcjkw </p>
</div>
</div>
</div>
</div>
<div class="faq" id="accordion">
<div class="card">
<div class="card-header" id="faqHeading-1">
<div class="mb-0">
<h5 class="faq-title" data-toggle="collapse" data-target="#faqCollapse-1" data-aria-expanded="true" data-aria-controls="faqCollapse-1">
<span class="badge"></span>How to view Ebooks?
</h5>
</div>
</div>
<div id="faqCollapse-1" class="collapse" aria-labelledby="faqHeading-1" data-parent="#accordion">
<div class="card-body">
<p> hb wv hjbvhwsbv jkvbjhbv bkwbcvkwc </p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<script src="/Scripts/jquery-3.4.1.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>
</body>
</html>
【问题讨论】：
标签： html css asp.net asp.net-mvc