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

我在页面和每个链接上至少有20个链接，我必须显示不同内容的弹出窗口。是否有任何方法可以只调用一个javascript函数并将其传递给ID的div必须显示为popup。我的HTML结构看起来像这样如何在同一页面中打开多个jquery对话框

<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>

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

来源

2013-04-12 Rajeev

是弹出的div隐藏？ – bksi

给他们一个'班级'并利用'这个' – billyonecan

这个链接可能有帮助：http://jquerytools.org/demos/overlay/multiple.html – Sid

jsFiddle Demo

你可以做这样的

$("div[id^=popup]").hide(); 
$("a").click(function(){ 
$("div[id^=popup]").hide(); 
var id = this.parentNode.id; 
$("#popup"+id).show(); 
});

来源

2013-04-12 10:30:37

我会尝试这样的事情

<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>

来源

2013-04-12 10:30:57 bksi

<div id='1' class="div"> 
<a href='#'>Moreinfo</a> 

    <div id='popup1' class="poppup">Content for first link</div> 
</div> 
<div id='2' class="div"> 
<a href='#'>Moreinfo</a> 

    <div id='popup2' class="poppup">Content for first link</div> 
</div>

JQUERY

$('.div').click(function() { 
     $('.poppup').hide(); 
     $(this).children('.poppup').show(); 
    });

JS FIDDLE LINK

来源

2013-04-12 10:34:31 rahularyansharma

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

回答

相关问题