Résumé des différentes méthodes d'actualisation pour jquerymobile partial Rendering_jquery

Sur la page JQueryMobile, un rendu global est effectué lors de la première initialisation. Les pages générées dynamiquement nécessitent un rendu partiel.

Comment implémenter le rendu partiel de listview dans jquerymobile :

Copiez le code Le code est le suivant :

function queryPublishOrderList(trackOrDealOrInsp,userCode,type,pageNum){ 
    var queryPublishOrderListURL="http://xxx.xxx.xxx.xxx/Myapp/WorkOrderSelByTypeService.svc/WorkOrderSimpSelByType/Json/" trackOrDealOrInsp " /" userCode "/" tapez "/" pageNum; 
    $.ajax({ 
        type : 'get', 
        dataType : "json", 
        url : queryPublishOrderListURL, 
        contentType : 'application/json', 
       données : [ ], 
        succès : function(data) { 
              var sb = new StringBuffer();  
              $.each(data, function(i,item){ 
                //创建一个工单列表行对象 
                sb.append("

"); 
                sb. append("
• " item.work_orders_id "" i "
" ); 
                sb.append("
• ");                sb.append("

  工单号:" item.work_orders_id ""); 
                  sb.append("

  创建人:" item.founder_na "

  "); 
                 sb.append("

  创建时间:" item .found_time "

  "); 
                 sb.append("

  工单类型:" item.type_na "

  "); 
                 sb.append("

  工单内容:" item.work_cont "

  "); 
                  sb.append("
"); 
                sb.append("

"); 
              }); 
              var content = sb.toString();  
                 $("#queryList").html(content); 
        }, 
        error:function(XMLHttpRequest, textStatus, errorThrown){ 
                alert("请求远程服务错误!"); 
        }, 
        complete : function() {     
              $("p[data-role=content] ul").listview();           
        }   
    }); 
}

Remarques :

Listview actualise le composant listview pour jquerymobile.

$("p[data-role=content] ul").listview();

Si vous souhaitez actualiser le li dans la liste, vous pouvez utiliser

$("p[data-role=content] ul li").listview("refresh");

Sinon, l'erreur sera signalée comme suit :

jquerymobile listview ne peut pas appeler les méthodes sur listview avant l'initialisation ; a tenté d'appeler la méthode 'refresh'

La case à cocher Jquerymobile doit être actualisée à temps pour obtenir sa valeur précise

Copier le code Le code est le suivant :

Généralement, lors de la connexion, il y a deux cases à cocher pour mémoriser le nom d'utilisateur et le mot de passe

En utilisant jquerymobile pour créer la page, lorsque la case est cochée, elle ne peut pas toujours obtenir sa valeur correcte.

Solution :
[code]
$('input[type="checkbox"]').bind('click',function() {
$(this). prop ('checked').checkboxradio("refresh"); // Lier les événements pour mettre à jour la valeur cochée de la case à cocher dans le temps
});

Si vous souhaitez utiliser js pour changer la case à cocher La valeur doit également être actualisée à temps.

$('input [type="checkbox"]').attr('checked',false).checkboxradio("refresh");
$('input [type="checkbox"] ').attr('checked',false).checkboxradio("refresh");

Cause : jquerymobile ne peut pas effectuer un nouveau rendu après avoir modifié manuellement sa valeur. De cette façon, la valeur affichée sur la page est différente de la valeur réelle. (jquerymobile masque tous les éléments du formulaire, puis utilise js pour ajouter certains éléments afin d'embellir les effets de saisie, de sélection, de zone de texte et d'autres éléments)
[/code]
Actualisation de la liste déroulante

Copier le code Le code est le suivant :

$("#selectbox").html(optionList).selectmenu( 'refresh', true ); 🎜>$("input[type='checkbox']").attr("checked",true).checkboxradio("refresh");

Groupe de boutons radio :
$("input [type='radio']").attr("checked",true).checkboxradio("refresh");

Sélectionner la liste :: var myselect = $( "select#foo") ; myselect[0].selectedIndex = 3; myselect.selectmenu("refresh"); Slider

$("input[type=range] ").val( 60).slider("refresh");

Switch (ils utilisent le curseur) :
var myswitch = $("select#bar");
myswitch[0] .selectedIndex = 1;
myswitch .slider("refresh");



sélectionner le style désactivé

disabled="disabled"
name="select-choice-1"
aria -disabled="true ">

Standard : 7 joursRush : 3 jours< /option>
Express : le lendemainNuit
style de bouton désactivéui-btn-hidden bouton-mobile-désactivé
ui-state- désactivé
" type="bouton"
disabled="disabled"
value="non disponible"
aria-disabled="true">

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn