Question

我有多个

的实例

<div class="picOuterDiv">
   <a href="examplepage.php?var=1" class="iframe" > page one </a>
</div>

<div class="picOuterDiv">
   <a href="examplepage.php?var=2" class="iframe" > page two </a>
</div>

现在我正在使用jQuery colorbox插件来创建Lightbox。单击锚元素时，lightBox会打开，类iframe的锚元素。它使用

直到这里工作正常

$(".iframe").colorbox({iframe:true, width:"646", height:"675"});

当我点击父div时，我想要打开颜色框。当单击div时，我使用以下代码触发锚元素href，但显然单独的href不够，单击的元素应该具有类“iframe”。所以它不能使用这段代码。

$('.picOuterDiv').each(function(){
        $(this).on('click', function(){
            location.href = $(this).find('a').attr('href');
        });
});

那么有人可以帮我解决这个问题吗？我希望问题很清楚。提前谢谢。

更新： http://jsfiddle.net/VhkFN/3/

Answer 1

$('.picOuterDiv').click(function() {
   window.location.href=$(this).find('a').attr('href');
});

你的小提琴有几个问题。首先“var arr []”不正确。其次，超链接没有任何onclick属性，因此触发点击不会有太大作用。你需要获取它的href属性。

演示：http://jsfiddle.net/VhkFN/4/

Answer 2

您可以在该div上使用click方法并触发颜色框应该使用的锚点上的click方法。

类似的东西：

$('.picOuterDiv').click(function() { $(this).find('a').trigger('click'); } );

Answer 3

这对我有用。正如我所说我使用的是jquery colorbox。

$(".picOuterDiv").click(function () {
   var anchorHref = $(this).find('a').attr('href');
   $(this).colorbox ({iframe:true, width:"646", height:"675", href: anchorHref});
});

如何调用子锚点击父div点击

3 个答案: