有没有办法检查某个元素的任何父母是否是标签?目前,它只检查直接父级,但我想知道是否有办法检查它是否包含在任何 ankor 标签中?
HTML:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
</head>
<body>
<a class="website">Load Content</a>
<a href=""><img width="200" height="200" class="zoom" /></a>
<a href=""><div><img width="78" height="101" class="zoom" /></div></a>
</body>
</html>
CSS:
.zoomBox {
position:absolute;
opacity:0;
background: url('http://www.shannonhochkins.com/_images/505706e8965f59080b0016a1') no-repeat center center;
}
JavaScript:
zoom = function() {
zoomBoxClass = 'zoomBox';
zoomContainer = $('.zoom');
zoomContainer.each(function() {
if ($(this).parent().is("a")) {
var $el = $('<div class="' + zoomBoxClass + '"></div>').insertBefore($(this)),
zwid = $(this).width(),
zhei = $(this).height(),
zpx = $(this).position().left,
zpy = $(this).position().top;
$el.css({
width: zwid,
height: zhei,
top: zpy,
left: zpx
});;
};
});
$(document).ready(function() {
zoom();
$("." + zoomBoxClass).mouseover(function() {
$(this).stop(true, true).animate({
opacity: 1.0
}, 'slow');
});
$("." + zoomBoxClass).mouseleave(function() {
$(this).stop(true, true).animate({
opacity: 0
}, 'slow');
});
});
它确实有效,但当它击中第二个时不正确。
我需要能够为页面上存在的每个类单独运行该函数。这可能吗?