1
データベースからフェッチされたデータの結果を表示するために作成された動的ページがあります。ページが作成されると、結果は良好に表示され、上下にスクロールして異なる結果を表示することができます。同じページに戻ると、スクロールが停止します
ただし、ページを離れて戻ると、スクロールアップ/スクロールができなくなるため、表示されているボタンを押し続けることができます。
私はJQueryモバイルを使用しています。
誰でも問題を表示できますか?
$.mobile.changePage("#" + page_id);
私はそれを読んで - あなたは変更する場合:しかし、この行が犯人であるとして、それはに思える - 私はまったくjQueryのモバイルを知らない
function fetchEvent() {
db = window.openDatabase("SoccerEarth", "2.0", "SoccerEarthDB", 2 * 1024 * 1024);
db.transaction(function(tx) {
var TitleT = document.getElementById("texttitle").value;
tx.executeSql("SELECT * FROM SoccerEvents WHERE Title LIKE '%" + TitleT + "%'", [], successCBValue, errorCB);
});
function successCBValue(tx, response, page_id) {
var formElements = "<table id='resulttable' data-role='table' data-mode='reflow' class='ui-responsive table-stroke table-stripe'><thead><tr><th>Title</th><th>Location</th><th>NoPeople</th><th>Date</th><th>Description</th></tr></thead><tbody>";
for (var i = 0; i < response.rows.length; i++) {
formElements += "<tr><td>" + response.rows.item(i).Title + "</td><td>" + response.rows.item(i).Location +"</td><td>" + response.rows.item(i).NoPeople + "</td><td>" + response.rows.item(i).Date +"</td><td>" + response.rows.item(i).Description + "<button data-rowtitle='" + response.rows.item(i).Title + "' data-mini='true' class='btnJoin'>Join</button></td></tr>";
}
formElements+="</tbody></table>";
$('#page_body').append('<div data-role="page" data-theme="d" id="' + page_id + '"><div data-role="content">' + formElements + '<a href="#page4" data-role="button" data-mini="true">Return</a></div></div>');
$.mobile.initializePage();
$.mobile.changePage("#" + page_id);
$(document).on("click", ".btnJoin", function(e){
var title = $(this).data("rowtitle");
updateEvent(title)
});
}
}
function updateEvent(title) {
db = window.openDatabase("SoccerEarth", "2.0", "SoccerEarthDB", 2 * 1024 * 1024);
db.transaction(function(tx) {
tx.executeSql("Update soccerevents SET NoPeople = NoPeople +1 WHERE Title = '" + title + "'", [], successJoin,errorCB);
});
function successJoin() {
navigator.notification.alert("You have joined the event!", null, "Information", "ok");
$(":mobile-pagecontainer").pagecontainer("change", "#page4");
}
}