jQuery从div中的一组图像中获取图像元素ID
[英]Jquery get the image element ID from a group of images in a div
问题描述
I've a simple issue, I cant find a way out. 
我有一个简单的问题，我找不到出路。 Im doing a small, simple slider/gallery 1) "If click button 1, image one appears" 2) "If I click on button 2, IMAGE 1, slide left, and IMAGE 2 fades in" 3) "If I click on any image, eg IMAGE 3, the current image slide left, new one fades in" 我正在做一个小的，简单的滑块/图库1）“如果单击按钮1，出现图像1” 2）“如果单击按钮2，图像1，向左滑动，图像2淡入” 3）“如果单击任何图像，例如IMAGE 3，当前图像向左滑动，新的图像会淡入“
My only issue is, how do I get the ID of the visible image, the one that is already showing. 我唯一的问题是，如何获取可见图像的ID（已显示）。 so that i can slide it, and fades in the image with respect to the button clicked. 这样我就可以滑动它，并且相对于单击的按钮淡入图像。
All the images are css "display none" by default and resides in the ".slider" div. 默认情况下，所有图像都是CSS“不显示”，并且位于“ .slider” div中。
<body>
<div class = "slider">
<img id="1" src = "img/img1.jpg" class = "pic" border = "0" />
<img id="2" src = "img/img2.jpg" class = "pic" border = "0" />
<img id="3" src = "img/img3.jpg" class = "pic" border = "0" />
</div>
<button type="button" class="btn" id="btn1">Btn 1</button>
<button type="button" class="btn" id="btn2">Btn 2</button>
<button type="button" class="btn" id="btn3">Btn 3</button>
</body>
<style type = "text/css">
.slider{
width:400px;
height:200px;
overflow:hidden;
margin:30px auto;
}
.slider img{
width:400px;
height:200px;
display:none;
}
</style>
<script>
$(document).ready(function(){
$(".btn").click(function() {
//alert($(".slider").children('.pic').attr('id'));
// or using (":visible:);
)};
)};
</script>
1 个解决方案
解决方案1
1 已采纳 2014-01-19 06:26:41
You can use the :visible selector to get the visible image 您可以使用：visible选择器获取可见图像
var $imgvisible = $('.slider img:visible');
alert($imgvisible.attr('id'))
But when the page loads it won't return anything because there are no visible images 但是，当页面加载时，它不会返回任何内容，因为没有可见的图像
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.