jquery - colorbox - 模式的链接和内容列表

Question

给定以下结构：

<table class="myTable">

    <tr>
        <td class="block.productgrid.quickview.cell">
            <a class="myLink">My Link</a>
        </td>
    </tr>


    <tr>
        <td>
            <div class="contentsForColorbox">
                Some contents
            </div>
        </td>
    </tr>

</table>

...我有几个像这样的表'myTable'，我怎样才能将点击'myLink'与在颜色框中显示'contentsForColorbox'配对？

我想我已经接近了，但我错过了一些东西：

$( '.myLink', this).click( function(){
    $.colorbox({
        inline : true,
        'href': $( '.contentsForColorbox') ,
        'width': 500,
        'height': 350
    });
});

...截至目前，如果我有 5 个表，“contentsForColorbox”中的 5 个将显示在颜色框中。唉，一天太长了:-(

Answer 1

问题是使用的选择器 - $( '.contentsForColorbox')，它针对具有给定类的所有元素，而不是您需要找到相对于单击的链接的目标

$( '.myLink', this).click( function(){
    $.colorbox({
        inline : true,
        'href': $(this).closest('table').find('.contentsForColorbox') ,
        'width': 500,
        'height': 350
    });
});

演示：小提琴