Question

我尝试打开由表格行上任意位置点击触发的fancybox。单击一行后，我在Firebug控制台中实现了此消息：

过多的递归 http://code.jquery.com/jquery-1.7.js 2925行

这是我的HTML：

<table id="allItems">
    <tr class="itemRow">
        <td><a href="http://www.google.com" class="foo">foo</a></td>
        <td>bar</td>
    </tr>
    <tr class="itemRow">
        <td><a href="http://www.bing.com" class="foo">bar</a></td>
        <td>bar</td>
    </tr>
</table>

这是我的javascript：

var itemRow = $('#allItems tr.itemRow');

itemRow.click(function(e){
    e.preventDefault();  
    $(this).find('.foo').trigger('click');
});


$('.foo').fancybox({
    'href' : $(this).attr('href'),
    'width'             : '100%',
    'height'            : '100%',
    'autoScale'         : false,
    'transitionIn'      : 'none',
    'transitionOut'     : 'none',
    'type'              : 'iframe'
});

您可以在此处找到实时示例：http://jsfiddle.net/svebal/zQ8FZ/

Answer 1

.trigger（）在几个浏览器/ jquery插件上非常不可靠。你想做的事：

var itemRow = $('#allItems tr.itemRow');

itemRow.click(function(e) {
    e.preventDefault();
    $.fancybox({
        'href': $(this).find('.foo').attr('href'),
        'width': '100%',
        'height': '100%',
        'autoScale': false,
        'transitionIn': 'none',
        'transitionOut': 'none',
        'type': 'iframe'
    });
});

Answer 2

实际上，您需要的唯一脚本是：

$('.foo').click(function(){
    $.fancybox({
            'href' : this.href,
            'width'             : '100%',
            'height'            : '100%',
            'autoScale'         : false,
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'type'              : 'iframe'
    });
    return false;
});

Answer 3

如果要在tr上单击任何td后显示灯箱，则必须更改此行：

 $(this).find('.foo').trigger('click');

到这个

 $(this).next().find('.foo').trigger('click');

这会在下一个元素

下找到哪个类为foo的元素

点击tablerow应该打开一个fancybox

3 个答案: