1

我有一个<li>从 CMS/DB 生成的项目列表。每个<li>都有一个<div>包含指向灯箱的链接(隐藏的<div>)。该链接以隐藏的 id <div>(#inline-content-print) 为目标,因此 javascript 插件会触发并拉起灯箱。

我遇到的问题是<li>页面上的所有 s 都使用相同的隐藏divid 生成(我可以将其更改为类)。所以无论<li>点击哪个href,它总是为<li>页面上的第一个(id的第一个实例)拉出灯箱。我需要一种方法让 href 从 THIS 中说出“打开#inline-content-print” div(被点击的链接所在的那个)”。

<li>
<div class="store-buttons-bg hide-print-buttons-{tag_Hide-Print-Buttons}">

<a href="#inline-content-print" class="various store-button">PRINT</a>

        <div style="display: none;" id="inline-content-print">
        CONTENT OF LIGHTBOX
        </div>
        <!-- end inline-content-print -->

</div>
</li>

任何建议将不胜感激。

4

2 回答 2

0

假设您想使用 jQuery/Javascript 执行此操作,您可以使用如下内容:

$(document).ready(function()
{
    $('li a.store-button').click(function(e)
    {
        var lightboxElement = $(e.currentTarget).find('div');
        lightboxElement.show(); // or whatever function you need to display
        return false;
    });
});

这是一个小脚本:

  1. 等待页面加载。
  2. 查找您的列表元素(按li对象类型和链接上的类)
  3. 拦截点击事件。
  4. 查找div嵌套在单击的链接中的元素。
  5. 在目标灯箱元素上显示(或运行其他功能)。
于 2012-09-30T17:00:45.203 回答
0

您使用的是什么服务器端语言?它是否在循环中生成这些列表项?该循环是否有索引?如果是这样,这对你有用。

[Server language version of a for loop with an index variable named "i"]
<li>
<div class="store-buttons-bg hide-print-buttons-{tag_Hide-Print-Buttons}">

<a href="#inline-content-print_[server language output of "i"]" class="various store-button">PRINT</a>

        <div style="display: none;" id="inline-content-print_[server language output of "i"]">
        CONTENT OF LIGHTBOX
        </div>
        <!-- end inline-content-print -->

</div>
</li>
[server language version of an end to the for loop]
于 2012-09-13T17:19:44.720 回答