Question

我正在试图弄清楚如何在点击的链接中打开fancybox中的div。

<div class="tool">              
    <ul>            
        <li><span class="more-info"><a href="#" title="View more info">?</a></span>         
            <div class="help">This is the help text</div>           
        </li>
    </ul>
</div>

我知道我可以将#uniqueDiv添加到a，然后添加ID为uniqueDiv的div，但是我希望在点击链接时，它会打开最近的div班help。

我试过这样的事情没有运气：

$('.more-info a').click(function(e){
    $(this).parent().next().fancybox();
    e.preventDefault();
});

非常感谢任何帮助。

-Ryan

Answer 1

我再考虑这个问题几个小时，并决定采用不同的方法，因为我几乎走到了尽头。我想如果我无法定位相对div，那么我可以自动分配href和id值，这样每个链接都可以通过其ID进行定位。

这实际上很漂亮，符合我的所有要求：

$('.more-info a').each(function(index){
    var x = index + 1;
    $(this).attr('href', '#box' + x);
    var li = $(this).parent().parent();
    $('.help', li).attr('id', 'box' + x);
}).fancybox();

$('.more-info a').each(function(index){我定位所有链接并循环显示它们。
var x = index + 1;索引从0开始，但为了便于阅读，我从1开始。
$(this).attr('href', '#box' + x);我获取当前链接的href值（当前为#）并将其替换为#box[INDEX]，其中index是唯一的自动递增数字。
var li = $(this).parent().parent();我移回了一个视图元素，这样我就可以磨练我隐藏的div .help。
$('.help', li).attr('id', 'box' + x);我现在定位.help div并添加一个名为id的属性并将其设置为box[INDEX]。我现在在链接和隐藏div之间有必要的关联，这样fancybox就可以发挥它的魔力。
}).fancybox();这让fancybox知道打开我的链接。

使用的jQuery函数： .each()，.attr()，.parent()

仍然赞赏任何建议或改进。

-Ryan

fancybox open relative div

1 个答案: