私はiPhone用のネイティブアプリケーションに取り組んでいます。このアプリケーションは、XMLからコンテンツを読み取ります。XMLからコンテンツを読み取るリンクとボタンがたくさんあります。戻るボタンを除いて、すべてがうまく機能しています。以来、シングルページアプリケーションを作成したため、戻るボタンが機能しません。このアプリケーションをマルチページに変換しようと思いました。しかし、jquery、XML、およびhtmlを使用してこれを行うための最良の方法はわかりません。私はxmlを読み、すべての値を配列に入れて配列を処理しました。
私はXMLを使用して読んでいます
<html>
<head>
<script>
$(document).ready(function() {
var meetingName = [];
var buildingName = [];
var floorInfo = [];
var officeContact = [];
var roomEmail = [];
var capacity = [];
var phoneNotes = [];
var pdfName = [];
var pdfRoomName=[];
var myHTMLOutput = '';
var indexVal='';
$('#menu').hide();
var location='';
// Open the IMRM.xml file
$.get("xml/IMRM.xml",{},function(xml) {
// Build an HTML string
// Run the function for each Room tag in the XML file
$('Room',xml).each(function(i) {
meetingName[i] = $(this).find("meetingRoomName").text();
buildingName[i] = $(this).find("buildingName").text();
floorInfo[i] = $(this).find("floorInfo").text();
officeContact[i] = $(this).find("officeContact").text();
roomEmail[i] = $(this).find("roomEmail").text();
capacity[i] = $(this).find("capacity").text();
phoneNotes[i] = $(this).find("phoneNotes").text();
pdfName[i] = $(this).find("pdfName").text();
pdfRoomName[i] = $(this).find("pdfRoomName").text();
}
);
document.getElementById("title").innerHTML = "Muncipal Building";
//Capture button click and show information for each room
$(".left").click(function() {
buttonClick($(this).attr("data-value"));
});
}
</script>
</head>
<body >
<div id="wrapper" class="imr">
<div data-role="page" data-theme="bu" id="imr">
<div data-role="header" data-theme="bk" class="ui-header" role="banner">
<a href="#" data-rel="back" data-add-back-btn="true" data-back-btn-text="Back" data-theme="bk" class="header-btn-bk back-btn" id="back"></a>
<h1 class="font-narrow font-bold imr-header-title" id= "title"></h1>
<a href= "Terms_of_use.html" data-theme="bk" class="header-btn-bk info-btn"></a>
</div>
<div data-role="content" data-theme="bu" class="content">
<div id="information" >
<!-- <a class = "policy" href= "Terms_of_use.html" style="display:inline"> Terms of Use </a> -->
</div>
<div id= "main" style="display:none">
<div id= "inputArea">
<input type="text" id ="roomInput" /> <input id= "cancel" type="button" value ="Cancel" disabled/>
<ul id= "auto_suggest" data-role="listview" data-insert="true"> </ul>
</div>
<div class="floor-btn">
<a href= "#" data-role="button" class="left" data-ajax= "false" data-value="1"> 1 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button" class="right" data-ajax= "false" data-value="2"> 2 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button"class="left" data-ajax= "false" data-value="3"> 3 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button" class="right" data-ajax= "false" data-value="4"> 4 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button"class="left" data-ajax= "false" data-value="5"> 5 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button" class="right" data-ajax= "false" data-value="6"> 6 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button"class="left" data-ajax= "false" data-value="7"> 7 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button" class="right" data-ajax= "false" data-value="8"> 8 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button"class="left" data-ajax= "false" data-value="9"> 9 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button" class="right" data-ajax= "false" data-value="10"> 10 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button"class="left" data-ajax= "false" data-value="11"> 11 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button" class="right" data-ajax= "false" data-value="12"> 12 <span class="floor-btn-bgtxt"></span></a>
<a href= "#" data-role="button" class="left" data-ajax= "false" data-value="B"> B <span class="floor-btn-bgtxt"></span></a>
</div>
</div>
</div><!-- End: content -->
</div><!-- End: page -->
</div><!-- End: wrapper -->
</body>
</html>
これでは、xmlを読み取り、各ノードを配列に保存しています。HTMLには、いくつかのボタン（1から12までの名前）、オートコンプリートテキストボックス、JSの配列からクリックするとコンテンツを取得するリンクがあります。これはすべて、1つのHTMLページで1つのXMLページを使用して行われています。ここで、ボタン1をクリックすると、リンクのリストが表示されます。クリックすると、いくつかの情報が表示されます。
同封の構造をご覧ください：
index.html（持っている）-> Button1、button2、button3など（Button1をクリック）->リンクa1、a2、a3などのリストを表示（a1をクリック）->表示いくつかの情報。
これはすべてindex.htmlページで行われ、それに応じてコンテンツを表示または非表示にします。なぜなら、それはたった1ページであり、URLに変更がないため、戻るボタンが機能していません。戻るボタンをクリックしたときの最後の状態を表示したい。例：最後の情報ページで[戻る]ボタンをクリックすると、リンクのリストページに移動します。
そのバックナンバーのために、私は複数ページのアプリケーションを使用することを考えました。しかし、それはXMLからすべてを読み取っているので、別のhtmlページでXMLを読み取るための最良の方法がわかりません。Cookieを使用したり、JSONを使用して値を取得したりするなど、さまざまな方法を見つけました。しかし、iphoneネイティブアプリにそれらのいずれかを使用するのが良いかどうかはわかりません。
私のアプリケーションをマルチページアプリケーションにするための最良の方法を教えてください。私はjqueryにかなり慣れていません。
どんな提案でも大歓迎です!!