首页 > 解决方案 > 需要 span.class 和 p 来展开切换

问题描述

我有一个投资组合网页,当单击项目时,我需要在其中显示描述和“图像”标签。为此,我使用切换,javascript。

我目前有这段代码,我希望 span.class 和段落在单击项目时都展开。否则,我希望这两个元素都隐藏在页面上。现在我不能在切换之前让 span.class 隐藏,所以只有段落显示在切换上,这导致整个事情看起来很奇怪。这是我正在使用的代码。

$(document).ready(function(){
        $(".li_element").each(function(index) {
        $(this).find('p','span.PopUp').first().hide();
        });

         $("li").click(function(){
           $(this).find('p','span.PopUp').first().toggle();
           $(this).toggleClass("expand");


         });
    }); 
 <li class="Project" data-modal="myModal_1">

                    <span id="myBtn_1">
                        Lirma Type
                    </span>

                    <span id="year">
                        2019
                    </span>

                    <div class="Describtion">
                      <span class="PopUp" >Images</id>
                        <p style="display:none;">
                           Typedesign
                        </p>
                    </div>

                
                    <div id="myModal_1" class="modal" >
                     <div class="modal-content">

                    <div id="demo" class="carousel slide" data-ride="carousel">
                          
                          <!-- The slideshow -->
                          <div class="carousel-inner">

                            <div class="carousel-item active">    
                              <img src="Images/Lirma/type.jpg" alt="img" width="100%">
                            </div>
                          </div>

                         <p>Type design</p>
                   </div>
                </div>
            </div>
        </li>

标签: javascriptclasstoggle

解决方案


只有一个字符串:

$(this).find('p,span.PopUp').first().hide();

或者你可能想要

$(this).find('p').first().hide();
$(this).find('span.PopUp').first().hide();

推荐阅读