これは私のメインページです:
<head>
<script type="text/javascript">
// Hide e2 and e3
$(document).on('pagechange', function(){
$("#e2").hide();
$("#e3").hide();
});
// Ajax call to insert e1-e3
$(document).on('pageshow', function(){
$("#course").bind("change", function() {
$.ajax({
type: "GET",
url: "includes/db/ajax.php",
data: "course="+$("#course").val(),
success: function(html) {
$("#insert-es").html(html);
$("#page").trigger('create');
}
});
});
});
</script>
</head>
<body>
<div data-role="page" id="insert-quests">
<div id="insert-es"></div>
</div>
</body>
Ajax.php は、データベース テーブルに基づいて div のリストを生成します。たとえば...
<div id="e1">...</div>
<div id="e2">...</div>
<div id="e3">...</div>
jQuery と AJAX を使用してこれらの div を追加する前に、以下のスクリプトを使用して 2 と 3 を非表示にすることができました。(ユーザーが 1 で特定の応答を選択した場合にのみ 2 と 3 が表示されることになっているため、これを行う必要があります。)
$(document).on('pageinit', function(){
$("#2").hide();
$("#3").hide();
});
だから私は2つの質問があります:
pagechange やその他のイベントを試しましたが、結果はありませんでした。AJAX を使用して持ち込んだコンテンツで jQuery モバイルを使用するにはどうすればよいですか?
div の量は、データベースのテーブル内のエントリの量に関連しています。そこでループを使用できるように、エントリの量を取得するにはどうすればよいですか? 例えば...
for ( var i = 0; i < amount_of_entries ; i++ ) {
$("#e" + i).hide();
}