jquery - 如何在同一页面中打开多个jquery对话框

Question

我在一个页面中至少有 20 个链接，并且在每个链接上我必须显示一个包含不同内容的弹出窗口。有什么方法可以让我只调用一个 javascript 函数并传递给它必须显示为弹出窗口的 div id .我的html结构如下所示

<div id='1'>    
<a href='#'>Moreinfo</a>
<div id='popup1'>
Content for first link
</div>
</div>

<div id='2'>
<a href='#'>Moreinfo</a>
<div id='popup2'>
Content for first link
</div>
</div>

此外，如果我单击其他链接，第一个链接应该关闭。 请在回复中给出合适的例子。 谢谢

Answer 1

我会尝试这样的事情

<div class="popupHolder">
    <div class="clickToPopup">Click here</div>
    <div class="popup">your popup content</div>
</div>
<div class="popupHolder">
    <div class="clickToPopup">Click here</div>
    <div class="popup">your popup content</div>
</div>
<script type="text/javascript">
    $(document).ready(function() {
        $(".clickToPopup").click(function(){
             $(".popup").hide();
             $(this).parent("div.popupHolder").children("div.popup").show();
        });
    });
</script>