多個jquery對話框

Question

我是新來的網絡和jquery，我有一個問題，所以我搜索web和stackoverflow顯示多個jquery對話框。但是我找不到完美的答案，所以我想在這裏發佈我的問題。

使用jQuery版本

<link rel="stylesheet" type="text/css" href="CSS/flick/jquery-ui-1.8.17.custom.css"> 
<SCRIPT TYPE="TEXT/JAVASCRIPT" SRC="JSS/jquery-1.7.1.min.js"></SCRIPT> 
<SCRIPT TYPE="TEXT/JAVASCRIPT" SRC="JSS/jquery-ui-1.8.17.custom.min.js"></SCRIPT> 

HTML代碼，我在我的網頁使用

林

<div class="Im_events"> 
<img SRC="Image/Thumb/Thumb-1.jpg" WIDTH="237" HEIGHT="237" ALT="Adventure and Thrill" /> 
<div class="event_text">Adventure &amp; Thrill</div>    
</div> 

像上面的html代碼，我對他們有12各&包含deferant細節當一個jQuery用戶clikc對話框應顯示內容。

我試圖用

<script> 
$(document).click(function() { 
$("#Im_events").dialog("option","position",'center',"zIndex", 100); 
$("#Im_events").dialog({height: 850,width:1000, modal: true,show: "clip",hide: "explode"}); 



$("#Im_events").click(function() { 
      $("#Im_events").dialog("open"); 
      $("#Im_events2").dialog("close"); 

      return false; 
     }); 
    }); 

<script> 
jQuery(function($) { 
    $('.Im_events').each(function() { 
    $.data(this, 'dialog', 
     $(this).next('.event_text').dialog({ 
     autoOpen: false, 
     modal: true, 
     title: 'Info', 
     width: 600, 
     height: 400, 
     position: [200,0], 
     draggable: false 
     }) 
    ); 
    }).click(function() { 
     $.data(this, 'dialog').dialog('open'); 
     return false; 
    }); 
}); 
</SCRIPT> 

兩個腳本並沒有解決我的問題，所以可以在任何一個給的解決方案給我。

Answer 1

如果它的工作，在新的DIV打開你的對話框。像這樣的代碼，

$(document).ready(function() { 
$('.Im_events').each(function() { 
    var $dialog = $('<div></div>'); 
    var $link = $(this).one('click', function() { 
     $dialog 
      .load($link.attr('href')) 
      .dialog({ 
       title: $link.attr('title'), 
       width: 500, 
       height: 300 
      }); 

     $link.click(function() { 
      $dialog.dialog('open'); 

      return false; 
     }); 

     return false; 
    }); 
}); 
});