我希望能够单击图像来显示/隐藏 div（带有文本）。我已经对一张图像进行了此操作，但我有多个图像需要切换文本。
JavaScript 代码
$(document).ready(function() {
$(".slidingDiv").hide();
$(".show_hide").show();
$('.show_hide').click(function() {
$("slidingDiv").slideToggle();
});
});
HTML：
<a href="#" class="show_hide"><img src="image.jpg"></a>
<div class="slidingDiv">
<h2>Title</h2>
<p>text</p>
</div>
所以这是可行的，但它只适用于一张图像+div。我想要第二个图像和 div，但使用相同的slidingDiv类，然后单击第二个图像来切换第二个 div 显然会切换两个 div。
那么如何让两个图像切换自己的 div，而不是在单击两个图像之一时同时切换两个 div？
你忘了添加"." in $("slidingDiv").slideToggle();
您也可以使用这个
JsFiddle 示例 https://jsfiddle.net/iamuttamkumarroy/u6d876oL/
$(document).ready(function() {
$(".slidingDiv").hide();
$(".show_hide").show();
$('.show_hide').click(function() {
//$(".slidingDiv").slideToggle();
var isvisible = $(this).next('.slidingDiv').is(':visible');
if ( isvisible ) {
$(this).next('.slidingDiv').hide();
} else{
$(this).next('.slidingDiv').show();
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<a href="#" class="show_hide"><img src="image.jpg" alt="img"/></a>
<div class="slidingDiv">
<h2>Title</h2>
<p>text</p>
</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
