页面上需要在fancybox窗口中打开的多个链接

Question

我有一个页面有几个链接。每个链接都应该在fancybox窗口中打开。超文本标记语言的结构是这样的：

<a href="#inline" class="fancybox"> Link 1 </ a>
<div id="inline"> Content for link 1 that opens in a fancybox window </ div>

<a href="#inline" class="fancybox"> Link 2 </ a>
<div id="inline"> Content for link 2 that opens in a fancybox window </ div>

<a href="#inline" class="fancybox"> Link 3 </ a>
<div id="inline"> Content for link 3 that opens in a fancybox window </ div>

通过点击任何链接将打开一个fancybox窗口，但并不总是有正确的内容。这并不奇怪，因为所有的内容div都有相同的ID。在fancybox窗口中为每个链接打开正确内容的最佳解决方案是什么？

编辑：我想我的问题解决了。我使用下面的代码：

<a href="#1" class="fancybox"> Link 1 </ a>
<div class="inline" id="1"> Content for link 1 that opens in a fancybox window </ div>

<a href="#2" class="fancybox"> Link 2 </ a>
<div class="inline" id="2"> Content for link 2 that opens in a fancybox window </ div>

<a href="#3" class="fancybox"> Link 3 </ a>
<div class="inline" id="3"> Content for link 3 that opens in a fancybox window </ div>

这个代码正确吗？

Answer 1

一个页面上超过1个元素的ID。如果要应用类似的CSS样式或将多个元素绑定到一个javascript，则应使用类似的类。

像这样的小提琴

<a class="fancy_link" id="link_1" href="#!">Content</a>
<a class="fancy_link" id="link_2" href="#!">Content</a>
<a class="fancy_link" id="link_3" href="#!">Content</a>