html点击子元素隐藏div,jq 点击div，显示当前div内容，隐藏其他div的子元素

效果：点击第一行第一张图片时展开第一张图片的字图，隐藏第二行的字图。同时，点击当前图片时能够正常的显示隐藏。

问题：点击当前图片时会隐藏了再显示。有没有好心人能够提示一下应该怎么解决这个bug。非常谢谢！！

图片展开

$(document).ready(function() {

$(".zhe").hide('slow');

$(".first").click(function() {

var index = $(this).index();

$(".zhe").hide('slow');

$(".zhe").eq(index).show('slow');

})

//以下是css代码

* {

padding: 0;

margin: 0;

}

img {

width: 200px;

height: 140px;

}

.wrap {

width: 100%;

}

.wrap ul li {

margin-right: 10px;

list-style-type: none;

}

.p-wrap {

display: flex;

flex-direction: column;

flex-wrap: wrap;

}

.first {

position: relative;

z-index: 99;

display: flex;

flex-direction: row;

height: 140px;

margin-top: 10px;

}

.zhe {

display: none;

margin-left: 10px;

}

.b {

display: flex;

flex-direction: row;

}

html点击子元素隐藏div,jq 点击div，显示当前div内容，隐藏其他div的子元素相关推荐

HTML鼠标悬停显示隐藏div,JQ实现鼠标悬停显示或隐藏DIV层
$(document).ready(function(){ $("#div1").hide(); //先将层隐藏起来 var canHide = false; //标记是否可隐 ...
Web前端：实现在一块区域（div）点击链接，在同一页面的指定区域显示链接的内容——基于css与div结合网页布局设计
1:效果: 初始: 点击首页: 点击个人主页 : 点击其他类似: 2:代码 (这里我只提供css文件和核心代码,链接内容不提供) 核心代码 <!DOCTYPE html> <html ...
隐藏计算机文件夹中,怎样显示电脑中已隐藏的文件夹
打开我的电脑! 在最上边点击工具(T) →文件夹选项在弹出对话框里点查看! 把高级设置里的:不显示隐藏文件和文件夹改选为:显示所有文件和文件夹点应用即可!good `如果是VAST 系统的话 ...
android studio内容提供者（查看短信的猫）点击查看短信，闪退，无法显示短信内容。（附程序源代码，以及解决办法）
报错的问题: Permission Denial: readingcom.android.providers.telephony.SmsProvider uri content://sms/ 找到问题 ...
关于table中一个隐藏的tr，改为显示后与其他tr样式不一样的问题
问题:使用谷歌浏览器table中一个隐藏的tr,改为显示后与其他tr样式不一样的根据来源的选择,改变下面输入框的类型和数量,微信号格式与其他tr不一致.显示如下: 解决方案: display 属性的 ...
jq点击所有子元素_jQuery删除/清空指定元素下的所有子节点的方法
上几篇文章详细的介绍了,我们可以利有jQuery中的detach()方法和jQuery中的remove()方法删除指定的或是匹配的元素,也可以使用removeClass()方法以及removeAttr ...
jquery实现点击标题显示内容，同级其他元素内容隐藏
最终呈现效果: jquery实现点击标题显示内容,同级其他元素内容隐藏视频核心代码块: //点击标题元素('历史上的今天')$(document).on('click','.item',functi ...
js点击显示div，点击取消隐藏div
js点击显示div,点击取消隐藏div <script language="javascript" type="text/javascript"> ...
点击一个按钮显示div，点击div之外的地方div隐藏，点击div之内的地方div不隐藏
<input id="btnClick" type="button" value="原生写法" class="btn-gre ...

html点击子元素隐藏div,jq 点击div，显示当前div内容，隐藏其他div的子元素

html点击子元素隐藏div,jq 点击div，显示当前div内容，隐藏其他div的子元素相关推荐

最新文章

热门文章