jquery mobile ne peut pas s'afficher correctement après l'ajout dynamique d'éléments Description de la solution_jquery.

Solution au problème selon lequel certains éléments ne peuvent pas être rendus correctement après que jquerymobile les ait ajoutés dynamiquement :
listview : Ajouter jq(".detail").listview("refresh");
div ou autres :Ajouter .trigger( "create" );
=================================== ====== =================================

Lorsque jqm initialise la page, il insérera les attributs et les classes jqm dans chaque élément en fonction de data-xxx. Une fois la page initialisée, si un élément est inséré dynamiquement, l'affichage est souvent moche car aucun style jqm n'est inséré. Vous pouvez utiliser les outils de développement du navigateur pour vérifier cela. Vous constaterez que certains éléments ont beaucoup plus de classes, mais le code de l'élément inséré dynamiquement est toujours le même que celui que vous l'avez écrit.

Si vous souhaitez que les éléments insérés dynamiquement aient des styles jqm, vous pouvez déclencher l'événement de création sur l'objet jqm :

Copier le code Codez comme suit :

$(selector).trigger('create');

L'événement create a un large éventail d'applications, et peut même être des éléments inexistants (balisage brut ?), comme l'insertion d'un bouton

Copier le code Le code est le suivant :

$('dy bouton'). appendTo('#content').trigger('create ');

Certains objets fournissent des méthodes d'actualisation, telles que listview et flip toggle. La différence avec create est que la méthode d'actualisation doit agir sur un objet existant, tel que
$('ul').listview('refresh'), et actualiser ne mettront à jour que les éléments nouvellement ajoutés. Par exemple, les derniers éléments ajoutés dans la liste seront mis à jour et ceux d'origine resteront inchangés. (Je ne sais pas si j'ai mal compris, certains d'entre eux n'ont pas été testés. Texte original

http://stackoverflow.com/questions/7663078/jquery-mobile-page-refresh-mechanism

Ne pas utiliser le style jqm :

Si vous ne souhaitez pas que jqm initialise automatiquement vos éléments, il existe deux méthodes. Ajoutez l'attribut data-role="none" ou configurez l'option keepNative dans l'événement mobileinit

Copiez le code Le code est comme suit :

$(document).bind('mobileinit',function(){
$.mobile.page.prototype.options.keepNative = "select, input.foo, textarea .bar";
});