同时需要span.class和p来进行扩展 [英] Need both span.class and p to expand on toggle
问题描述
我有一个投资组合网页,单击项目时,需要描述和"Image"标签来显示.为此,我正在使用javascript.
I have a portfolio webpage, where I need describtions and and "Image"-tag to show, when the projects are clicked. For this I am using toggle, javascript.
我目前有这段代码,我希望在单击项目时将span.class和该段落都展开.否则,我希望两个元素都在页面上保持隐藏.现在,我无法使span.class在切换之前隐藏,因此在切换时仅显示该段落,这会使整个内容看起来很奇怪.这是我正在使用的代码.
I currently have this piece of code, where I want the span.class and the paragraph to both expand when the project is clicked. Otherwise I wish that both elements remain hidden on the page. Right now I cannot make span.class hide before toggle, and so only the paragraph show on toggle, which causes the whole thing to look wierd. This is the code I am using.
$(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>
推荐答案
只需一个字符串:
$(this).find('p,span.PopUp').first().hide();
或者也许你想要
$(this).find('p').first().hide();
$(this).find('span.PopUp').first().hide();
这篇关于同时需要span.class和p来进行扩展的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!