<div class="item">
<p><img src="images/photos_sample1.jpg"
border="0" rel="images/google_map.jpg"></p>
<p>Dining Area</p>
</div>
<div class="item">
<p><img src="images/photos_sample2.jpg"
border="0" rel="images/sample_photo.jpg"></p>
<p>Pool Area</p>
</div>
我有上面的HTML代码,我想在单击图像时获取rel属性的值.我写了这个jQuery脚本,但它似乎不起作用：
$('div.item').click(function() {
var getvalue = $('this > p > img').attr('rel');
alert(getvalue);
});
解决方法
替换这个：
var getvalue = $('this > p > img').attr('rel');
有了这个：
var getvalue = $(this).find('p > img').attr('rel');
等效代码也将是：
var getvalue = $('p > img',this).attr('rel');
虽然看起来它的项目是图像/标题组合,你不会真正期待其他图像,在这种情况下,最好只做：
var getvalue = $(this).find('img').attr('rel');
或者也许给它一个描述性的类并用img.someclassname替换img – 这将使得如果你以后编辑HTML,你的Javascript不会因为你的特定选择器而中断.
此外,您可以将click事件绑定到图像本身：
$('div.item img').click(function() {
var getvalue = $(this).attr('rel');
});
