jQuery Dialog Открыть (более одного раза)? - PullRequest
Новая
       7

jQuery Dialog Открыть (более одного раза)?

0 голосов
/ 06 апреля 2011

Я нашел некоторый код jQuery онлайн для диалога jQuery, и он прекрасно работает.Проблема, с которой я сталкиваюсь, заключается в том, что когда я щелкаю по связанному изображению, чтобы открыть диалоговое окно, оно открывается, как и должно, но если я закрою диалоговое окно и снова щелкните по связанному изображению, оно не откроет диалоговое окно jQuery.

ВотjQuery код: 

$(document).ready(function(){
       $('#gravatarprofilemoreinfoshow').click(function(){
           $('#gravatarprofilemoreinfo').dialog({
               modal:true,
               resizable: false,
               draggable: true,
               width: '486px',
               height: 'auto',
               hide: 'size',
               autoOpen: true,
               buttons:{ "Close": function() { $(this).dialog("close"); } },
               close: function(ev, ui) { $(this).remove(); }
           });
       });
   });

HTML-разметка: 

<a href="#" id="gravatarprofilemoreinfoshow" rel="/somelink" >
<img class="profileimgright profileimgframe" alt="Profile Image" src="/url/to/image" />
</a>

Как настроить код?Также есть ли способ изменить код, чтобы он не зависел от уникальных идентификаторов?

Причина, по которой я спрашиваю, я хотел бы использовать приведенный выше код jQuery для отображения различной информации, но для приведенного выше кода требуетсяуникальное имя (извините, не знаю, как его называют в jQuery) и хотите, чтобы код можно было повторно использовать на моем сайте.

1 Ответ

4 голосов
/ 06 апреля 2011

Вы должны удалить строку 

close: function(ev, ui) { $(this).remove(); }

проблема в том, что он закрывает диалоговое окно и его содержимое после закрытия, поэтому вы не можете использовать его при втором нажатии. Взгляните на jQuery Удалить

Кроме того, чтобы повторно использовать этот код, вы можете сделать следующее. Объявите метод, который регистрирует диалог по щелчку. Этот метод будет передан селекторам изображения и диалогу 

function registerDialogOnImageClick($image, $dialog){
      $image.click(function(){
           $dialog.dialog({
               modal:true,
               resizable: false,
               draggable: true,
               width: '486px',
               height: 'auto',
               hide: 'size',
               autoOpen: true,
               buttons:{ "Close": function() { $(this).dialog("close"); } },
           });
       });
   }

этот код можно вызывать откуда угодно, передавая селекторы изображения и диалоговое окно 

$(document).ready(function(){
   registerDialogOnImageClick($('#gravatarprofilemoreinfoshow'), $('#gravatarprofilemoreinfo');
});
...