我有一个包含1到多个图像的div,包含下一个和上一个图像按钮。当用户单击下一个/上一个按钮时,使用jquery将当前图像样式从display:block
更改为display:none
。我需要从显示的当前图像中获取ID属性。已应用display:block
样式。
<div id="propPhotos" name="propPhotos">
<div id="propPhotsDivList">
<div id="imageNameId0" style="display:block">
<img src="/PropertyImages/1/171fc210b4584f41936a078c4176c7e0.jpg" height="200" width="200" id="3"/>
</div>
<div id="imageNameId1" style="display:none">
<img src="/PropertyImages/1/114810f0067749eda8049d2f8269dd00.jpg" height="200" width="200" id="4"/>
</div>
<div id="imageNameId2" style="display:none">
<img src="/PropertyImages/1/8.jpg" height="200" width="200" id="15"/>
</div>
<div id="imageNameId3" style="display:none">
<img src="/PropertyImages/1/e8f182ab645549b399cebc67ed996d151.jpg" height="200" width="200" id="25"/>
</div>
</div>
<div>
<div class="row">
<input type="button" id="NextImage" value="Next Image" onclick="ImageNext()" /><input type="button" id="PrevImage" value="Previous Image" onclick=" ImagePrev()" />
</div>
<div class="row">
<button type="button" class="AddImage">Add Image</button><button type="button" class="RemoveImage">Remove This Image</button>
</div>
</div>
这是我目前在next
和previous
图片点击处理程序中的路径。
CurrentImageId = document.getElementById("imageNameId" + id).children('img').attr('id');
因此,当用户单击任一按钮时,它应该将id值分配给CurrentImageId。如果没有点击next
或previous
图片按钮,这对于初始加载不起作用。
答案 0 :(得分:1)
嗯,就初始负载而言,有几种不同的方法。以下是几个例子:
使用:visible
选择器:
var currentImageId = $('#propPhotsDivList > div:visible > img').prop('id');
或者可能与filter()
结合使用:
var currentImageId = $('#propPhotsDivList img').filter(function(){
return $(this).parent('div').is(':visible');
}).prop('id');
如果使用您的点击处理程序隐藏div并显示相关内容,您也可以在其中使用相同的功能。
答案 1 :(得分:0)
$('#propPhotsDivList').children('div:not(:hidden)').attr('id');