Diálogo jQuery con contenido dinámico

Question

Quiero crear un diálogo jQuery sobre la marcha. Estoy usando esto:

var newDiv = $(document.createElement('div')); 
$(newDiv).html('hello there'); 
$(newDiv).dialog(); 

que luego tienen esto en la cabecera HTML:

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.8.1.custom.min.js"></script> 

Cuando trato de ejecutar la JS en IE7 me sale el siguiente error en el $ (newDiv) .dialog(); línea: El objeto no admite esta propiedad o método.

Alguien sabe lo que está pasando?

Answer 1

funciona su código, puede probarlo here, eso significa que es probable que tenga una secuencia de comandos incluyen problema, asegúrese de que sus archivos están en una carpeta jslado de la página, o si se les pretende que sea de raíz del sitio , use /js en su lugar.

O, consider using a CDN.

Puede hacer que el código un poco más eficiente (me doy cuenta de que es sólo una prueba), así:

var newDiv = $(document.createElement('div')); 
newDiv.html('hello there'); 
newDiv.dialog(); 

Esto funciona porque newDiv es ya un elemento de jQuery, no hay razón para clonar el objeto cada vez ... o un poco más corto:

$('<div />').html('hello there').dialog(); 

Answer 2

Aquí es una forma alternativa de crear diálogos y sus mensajes de forma dinámica:

 $('<div></div>').dialog({ 
     modal: true, 
     title: "Confirmation", 
     open: function() { 
      var markup = 'Hello World'; 
      $(this).html(markup); 
     }, 
     buttons: { 
      Ok: function() { 
      $(this).dialog("close"); 
      } 
     } 
     }); //end confirm dialog 

verlo en acción: http://jsfiddle.net/DYbwb/

Answer 3

El código es bueno, lo que necesita es una referencia de jQuery y jQuery UI

<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>