Question

我为wordpress中的侧边栏文本小部件创建了一个onclick popup redmore按钮，只是复制并粘贴了我找到here的代码。我做了一些小改动，一切正常。

当我不得不为其余的侧边栏小部件创建更多onclick弹出窗口时出现问题，完全相同的弹出窗口具有相同的值但具有不同的img和内容文本。

问题是＆＃34; redmore＆＃34;第一个小部件和第二个小部件中的按钮链接到同一个东西 - 所以无论你点击哪个redmore按钮，它都会打开相同的按钮 -

this is the website查看右侧边栏中的前两项。

由于我对Javascript了解不多，我问您是否可以帮助我更改代码中的javascript标记链接，以便链接到另一个不同的弹出窗口而不是同一个弹出窗口 - 以及让我了解如何改变它，因为我必须做一些弹出窗口。

Answer 1

您需要更改每个弹出窗口的ID

getElementById('fade')
getElementById('light')

[第一个]

getElementById('fadesec')
getElementById('lightsec')

[第二]
等等......在html内容上同样的事情，不要只是复制，更改ID

示例二：

<p>This is the main content. To display a lightbox click <a href = "javascript:void(0)" onclick = "document.getElementById('lightsec').style.display='block';document.getElementById('fadesec').style.display='block'">here</a></p>
    <div id="lightsec" class="white_content">This is the lightbox content. <a href = "javascript:void(0)" onclick = "document.getElementById('lightsec').style.display='none';document.getElementById('fadesec').style.display='none'">Close</a></div>
    <div id="fadesec" class="black_overlay"></div>

Answer 2

您应该更改内容的Id属性，例如

<div id="light2" class="white_content">
<div id="fade2" class="black_overlay">

第二次弹出并将第二次读取更多文本的javascript更改为

<a href = "javascript:void(0)" onclick = "document.getElementById('light2').style.display='block';document.getElementById('fade2').style.display='block'">here</a>

同样应该适用于所有其他弹出窗口。

我在这里更改了fiddle

我需要更改javascript代码

2 个答案: