如何在同一頁面中打開多個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對話框

回答

相關問題