¿Cómo reproduzco las etiquetas de ancla generadas dinámicamente en jquery Mobile?

Question

Recibo un snippet html de etiqueta de ancla del servidor en una llamada ajax. ¿Cómo "actualizo" para que jquery mobile pueda agregar las clases necesarias a los enlaces?

Por ejemplo el enlace que genera móvil jQuery tiene una interfaz de usuario de enlace:

<a class="ui-link" href="http://www.google.com">http://www.google.com</a> 

¿Cómo me aseguro de que los estilos correctos se añaden en una etiqueta de anclaje recién generado?

Answer 1

Aquí es al menos una manera de refrescar el estilo de jQuery Mobile botones:

$(yourButtons).button('refresh'); 

Documentación: http://jquerymobile.com/test/docs/buttons/buttons-types.html

Answer 2

Si desea actualizar un widget que ya ha sido inicializado a continuación, se puede refrescar cada tipo widget usando su respectivo función:

$('.ui-btn').button('refresh'); 

Aviso utilicé la clase .ui-btn para seleccionar la culata En los elementos, esta clase se agrega una vez que se inicializa el botón, por lo que puede estar seguro de que está actualizando un widget de botón ya inicializado.

Docs: http://jquerymobile.com/demos/1.1.0-rc.1/docs/buttons/buttons-methods.html

Si necesita inicializar un widget que aún no se ha inicializado, entonces simplemente omiten la 'refresh' o utilizar .trigger('create'): Aviso

$('[data-role="button"], button, input[type="button"], input[type="submit"]').not('.ui-btn').button();//or .trigger('create'); 

aquí omito los widgets ya inicializadas usando .not('.ui-btn') por lo que esto solo inicializará widgets no inicializados. Si intentas inicializar un widget que ya se ha inicializado, obtienes un error (lo mismo si tratas de actualizar un widget que aún no se ha inicializado).

actualización

Si el HTML está siendo emitida por el servidor a continuación, puede inicializar los reproductores antes de añadirlos a la DOM:

$.ajax({ 
    ... 
    success : function (serverResponse) { 
     var $out = $(serverResponse); 
     //if there is a container with elements inside it, use `.find()`, 
     //if all the elements are siblings at the top level then use `.filter()` 
     $out.find('a').button(); 
     $('body').append($out); 
    } 
}); 

También puede utilizar la función .buttonMarkup() para actualizar el botón de exclusión: http://jquerymobile.com/demos/1.1.0-rc.1/docs/buttons/buttons-options.html