Question

我遇到的问题是，每当我点击问题时，它必须显示答案，但我无法得到它，所以请帮助我得到它。

我的代码：

    <html>
   <head>
      <meta charset="UTF-8">
      <title>FAQ</title>
   </head>
   <body>
      <div class="faq">
         <ul class="frequent-ul list-unstyled">
            <div class="bb">
               <li class="question clearfix accordion" id="accordionExample show">
                  <span class="frequent-icon">Q</span> 
                  <h4 class="frequent-text">I am a non-tech can I still learn Blockchain?</h4>
               </li>
            </div>
            <div class="aa">
               <li class="answer clearfix" id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample hide"><span class="frequent-icon">A</span> <span class="frequent-text">Yes, for the fundamentals of blockchain, any graduate having passion to learn this technology can take the program.</span></li>
            </div>
         </ul>
      </div>
   </body>
</html>

<script>
   $("h4.frequent-text").on('click', function() {
     $(this).next(".aa").slideToggle('slow');
   });
   
   $(document).ready(function() {
     $(".aa").children("li").hide();
   })
</script>

Answer 1

您有一个无效 html。您不应将 <div> 放在 <ul> 内和 <li> 标签的顶部。

并且我稍微编辑了您的 jquery 代码。

$(document).ready(function() {
  $(".frequent-text").hide();
    $(".frequent-icon").on('click', function() {
      $(this).next(".frequent-text").slideToggle('slow');
  });     
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
   <head>
      <meta charset="UTF-8">
      <title>FAQ</title>
   </head>
   <body>
      <div class="faq">
         <ul class="frequent-ul list-unstyled">
            <li class="question clearfix accordion" id="accordionExample show">
               <span class="frequent-icon">Q</span> 
               <h4 class="frequent-text">I am a non-tech can I still learn Blockchain?</h4>
            </li>
            <li class="answer clearfix" id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample hide">
               <span class="frequent-icon">A</span>
               <span class="frequent-text">Yes, for the fundamentals of blockchain, any graduate having passion to learn this technology can take the program.</span>
            </li>
         </ul>
      </div>
   </body>
</html>

我无法获得显示切换

1 个答案: