jquerymobileローカルレンダリングの各種リフレッシュ方法

4253 ワード

JQueryMobileページでは、最初の初期化で全体的なレンダリングを行い、動的な生成にはローカルレンダリングが必要です。
jquerymobileでlistview局部レンダリングを実現する方法：


function queryPublishOrderList(trackOrDealOrInsp,userCode,type,pageNum){  
    var queryPublishOrderListURL="http://xxx.xxx.xxx.xxx/Myapp/WorkOrderSelByTypeService.svc/WorkOrderSimpSelByType/Json/"+trackOrDealOrInsp+"/"+userCode+"/"+type+"/"+pageNum;  
    $.ajax({  
        type: 'get',  
        dataType : "json",  
        url: queryPublishOrderListURL,  
        contentType: 'application/json',  
        data: [],  
        success: function(data) {  
              var sb = new StringBuffer();   
              $.each(data, function(i,item){  
                 //             
                sb.append("<ul data-role='listview' data-inset='true' data-theme='c' data-pidertheme='b' >");  
                sb.append("<li data-role='list-pider'> "+item.work_orders_id+"<span class='ui-li-count'>"+i+"</span></li>");  
                sb.append("<li><a id='"+item.work_orders_id+"' href='inspectorder.html' >");  
                sb.append("<p data-role='fieldcontain' ><label for='work_orders_id'>   :</label><span id='work_orders_id'>"+item.work_orders_id+"</span></p>");  
                sb.append("<p data-role='fieldcontain'><label for='founder_na'>   :</label><span id='founder_na'>"+item.founder_na+"</span></p>");  
                sb.append("<p data-role='fieldcontain'><label for='found_time'>    :</label><span id='found_time'>"+item.found_time+"</span></p>");  
                sb.append("<p data-role='fieldcontain'><label for='type_na'>    :</label><span id='type_na'>"+item.type_na+"</span><img  src='../../images/beforeforward.png' style='float: right'/></p>");  
                sb.append("<p data-role='fieldcontain'><label  for='work_cont'>    :</label><span id='work_cont'>"+item.work_cont+"</span></p>");  
                sb.append("</a></li>");  
                sb.append("</ul>");  
              });  
              var content = sb.toString();   
                 $("#queryList").html(content);  
        },  
        error:function(XMLHttpRequest, textStatus, errorThrown){  
                alert("        !");  
        },  
        complete: function() {      
              $("p[data-role=content] ul").listview();            
        }    
    });  
}

備考：
listviewはjquerymobileに対してlistviewコンポーネントを更新します。
ドル（"p[data-role=content]ul"）.listview（）;
listview内部のliリフレッシュに対して使用できます。
ドル（"p[data-role=content]ul li"）.listview（“refresh”）；
さもないとエラーは以下の通りです。
jquerymobile listview cannot call methods on listview pror to initialization；atempted to call method'refresh'
jquerymobile checkboxは適時に更新してこそ、その正確な値を得ることができます。 jsでcheckboxの値を変更する場合も、適時に更新します。 $('input[type="checkbox""").atr('checked'，false).checkbox radio("refresh") $('input[type="checkbox""").atr('checked'，false).checkbox radio("refresh") なぜなら、手動で値を変えたら、jquerymobileは再レンダリングできないからです。このようにページに表示される値と実際の値が異なります。jquerymobileはformフォームの要素をすべて隠して、いくつかの要素をjsで追加してinputを美化しやすくして、select、textareaなどの要素の効果を上げます。イ-state-disable" disabled=「disabled」name=「select-chece-1」 ara-disabled="true"

js特殊文字フィルタのコード例

JqueryMobileはlistViewを動的に生成し、リフレッシュする二つの方法を実現します。