jquerymobile 部分レンダリング_jquery のさまざまな更新方法のまとめ

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',
データ: [ ],
success: 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();           
}
}); 
}

備考:

Listview は、jquerymobile の listview コンポーネントを更新します。

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

リストビュー内の li を更新したい場合は、

を使用できます。

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

それ以外の場合、エラーは次のように報告されます:

jquerymobile listview は、初期化前にリストビューのメソッドを呼び出すことができません。メソッド 'refresh' を呼び出そうとしました。

正確な値を取得するには、Jquerymobile チェックボックスを更新する必要があります

コードをコピー コードは次のとおりです:

通常、ログイン時にユーザー名とパスワードを記憶するための 2 つのチェックボックスがあります。

jquerymobile を使用してページを作成すると、チェックボックスがオンになっている場合、常に正しい値が取得されるとは限りません。

解決策:
[code]
$('input[type="checkbox"]').bind('click',function() {
$(this).prop ('checked').checkboxradio("refresh"); // イベントをバインドして、チェックボックスのチェック値を時間内に更新します

を使用する場合js を使用してチェックボックスを変更します。値も時間内に更新する必要があります。

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

原因: jquerymobile は値を手動で変更した後、再レンダリングできません。 このように、ページ上に表示される値は実際の値とは異なります。 (jquerymobile はすべてのフォーム要素を非表示にし、js を使用していくつかの要素を追加して、input、select、textarea、その他の要素の効果を美しくします)
[/code]
ドロップダウン ボックスの更新

コードをコピー コードは次のとおりです。

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

ラジオ ボタン グループ:
$("input [type='radio']").attr("checked",true).checkboxradio("refresh");

リストの選択::

var myselect = $( "select#foo") ; myselect[0].selectedIndex = 3; スライダー $("input[type=range] ").val( 60).slider("refresh"); スイッチ (スライダーを使用):

var myswitch = $("select#bar");

myswitch[0] .selectedIndex = 1;
myswitch .slider("refresh");



選択無効スタイル

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

標準: 7 日間
ラッシュ: 3 日間< /option>
特急: 翌日
夜間

ボタン無効スタイル mobile-button-disabled ui-state-無効" type="button"
disabled="disabled"value="利用不可"
aria-disabled="true">

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。