Несколько диалогов Jquery

Question

Я новичок в web и Jquery, у меня возникла проблема, поэтому я искал web и stackoverflow для отображения диалогового окна Multiple 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 штук, каждая из которых содержит подробные сведения, когда пользовательские клики в диалоговом окне jquery должны отображать содержимое.

Я пытался использовать

<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;
    });
});
});