Новое диалоговое окно jQuery с каждым щелчком

Question

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

<script> 
$(document).ready(function() { 
    $("#private1").dialog({ 
    beforeClose: function(event, ui) { 
    removeprivate(); 
    }, 
    width: 460, 
    height: 300, 
    closeOnEscape: false, 
    hide: "fadeout", 
    resizable: false, 
    } 
    ); 
    }); 
</script> 
<div id="dialog" title="hi"></div> 

Я хочу, чтобы при щелчке ссылки откройте один диалог, и когда снова щелкните еще раз, откройте еще один диалог и многое другое.

Answer 1

function TestMessage(message) { 
      $('<div class="TestDialog"></div>').appendTo('body') 
        .html('<div><h6>' + message + '</h6></div>') 
        .dialog({ 
         modal: true, title: 'Test message', zIndex: 10000, autoOpen: true, 
         width: 460, height: 300, modal: false, resizable: false, closeOnEscape: false, 
         //hide: "fadeout", 
         beforeClose: function (event, ui) { 
          //removeprivate(); 
         }, 
         buttons: { 
          Ok: function() { 
           $(this).dialog("close"); 
          } 
         }, 
         close: function (event, ui) { 
          $(this).remove(); 
         } 
        }); 
     }; 

     $(document).ready(function() { 
      $('#btnTest').live('click', function() { 
       TestMessage('Hi!'); 
      }); 
     }); 

для живой демонстрации смотрите по этой ссылке: http://jsfiddle.net/nanoquantumtech/sqdkB/

Answer 2

$('.button').click(function() { 
     $('#dialog').clone().appendTo('body').dialog({ 
      //your dialog options goes here 
     }).dialog('open'); 
}));