我正在建立一个图库，在其中我需要能够单击图像，并且Jquery代码检索单击图像的源，以便以后可以对其进行操作。问题是，我只能检索特定图像的图像src，而不能检索图像列表中的任何一个。我的标记是：
<div class="row normally gallery">
<div class="col-md-3 col-lg-3 col-sx-6 col-sm-6 thumbnail">
<a href="#"><img src="{{asset('images/projects/nccamh.jpg')}}" class="img-responsive projects" alt="NCCAMH.ORG"/><p class="caption">NCCAMH.ORG</p></a>
</div>
<div class="col-md-3 col-lg-3 col-sx-6 col-sm-6 thumbnail">
<a href="#"><img src="{{asset('images/projects/sewatrust.jpg')}}" class="img-responsive projects" alt="NCCAMH.ORG"/><p class="caption">Sewa Trust</p></a>
</div>
<div class="col-md-3 col-lg-3 col-sx-6 col-sm-6 thumbnail">
<a href="#"><img src="{{asset('images/projects/pdf.jpg')}}" class="img-responsive projects" alt="NCCAMH.ORG"/><p class="caption">PDF Sindh</p></a>
</div>
<div class="col-md-3 col-lg-3 col-sx-6 col-sm-6 thumbnail">
<a href="#"><img src="{{asset('images/projects/wejourno.jpg')}}" class="img-responsive projects" alt="NCCAMH.ORG"/><p class="caption">PDF Sindh</p></a>
</div>
<div class="col-md-3 col-lg-3 col-sx-6 col-sm-6 thumbnail">
<a href="#"><img src="{{asset('images/projects/sso.jpg')}}" class="img-responsive projects" alt="NCCAMH.ORG"/><p class="caption">Sujag Sunsar Organization</p></a>
</div>
<div class="col-md-3 col-lg-3 col-sx-6 col-sm-6 thumbnail">
<a href="#"><img src="{{asset('images/projects/sursociety.jpg')}}" class="img-responsive projects" alt="NCCAMH.ORG"/><p class="caption">Sur Society</p></a>
</div>
<div class="col-md-3 col-lg-3 col-sx-6 col-sm-6 thumbnail">
<a href="#"><img src="{{asset('images/projects/dailysindh.jpg')}}" class="img-responsive projects" alt="NCCAMH.ORG"/><p class="caption">Daily Sindh</p></a>
</div>
<div class="col-md-3 col-lg-3 col-sx-6 col-sm-6 thumbnail">
<a href="#"><img src="{{asset('images/projects/sawail.jpg')}}" class="img-responsive projects" alt="NCCAMH.ORG"/><p class="caption">Sawail</p></a>
</div>
</div>
而Jquery代码是：
$(document).ready(function() {
$('.gallery').click(function() {
var src = $(this).find('img').attr('src');
alert(src);
});
});
无论我在该div中单击任何图像，它都只给我第一张图像的img src。我该怎么办，以便它单击任一图像，并产生正确的img src。ps：我尝试了另一个，但是它产生了'undefined'值：
$(document).ready(function() {
$('img').click(function() {
var src = $(this).find('img').attr('src');
alert(src);
});
});
失败的
您可以使用类缩略图编写div事件：
$(document).ready(function() {
$('.thumbnail').click(function() {
var src = $(this).find('img').attr('src');
alert(src);
});
});
或者：
$(document).ready(function() {
$('.gallery').on('click','.thumbnail',function() {
var src = $(this).find('img').attr('src');
alert(src);
});
});
或直接在图片事件中：
$（document）.ready（function（）{
$('.gallery').on('click','.img-responsive',function() {
var src = $(this).attr('src');
alert(src);
});
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句