更新:抱歉,我不小心将data-dom-cache="true"
行复制到了我的content-div中。似乎非常符合逻辑,即应用程序是从dom而不是新内容加载的!我已将其更改为false
,现在效果非常好。
我有一个动态生成的列表。如果有人单击列表中的条目,则会将用户重定向到加载数据的新页面(动态)。加载的数据取决于用户单击的列表条目。
第一次加载应用时,一切正常。但是当用户点击另一个列表条目时,相同的数据将表示为第一次运行。
我玩过jQuery中的.empty()
函数(清除div并附加新数据),但它不起作用。
编辑:
我的headlines.html文件如下所示:
<div id="content>
<div id="headlineslist">
<ul data-role="listview" data-theme="c" id="headlineslist">
</ul>
</div>
</div>
<script>
$(document).ready(function() {
HeadlinesLoad();
});
</script>
这是Javascript文件:
function HeadlinesLoad() {
$.ajax({
type: "POST",
url: "headlines_getter.php",
dataType: 'json',
cache: false,
success: function(data1) {
$.each(data1, function(i, currentObj) {
$('ul#headlineslist').append('<li data-role="list-divider"
class="ui-li ui-li-divider ui-bar-b">' + currentObj.main + '</li>').listview('refresh');
$.each(currentObj.sub, function (j, currentSub) {
$('ul#headlineslist').append('<li>
<a href="headlinesclicked_temp.html" onclick="headlineID(' + currentSub.sid + ')">' + currentSub.name + '</a></li>').listview('refresh');
});
});
}
});
}
function headlineID(hID) {
window.localStorage.setItem("headlineID", hID);
}
function onHeadlinesLoad() {
var hID = window.localStorage.getItem("headlineID");
window.localStorage.removeItem("headlineID");
window.localStorage.clear();
$.ajax({
url: "headlinesclicked_getter.php?hID=" + hID,
success: function(html) {
if(html){
$("#headlineshome").empty();
$("#headlineshome").html(html);
}
}
});
}
以下是放在HTML文件中的片段,其中应显示数据(并在用户每次点击时刷新):
<div data-role="content" id="headlineshome"></div>
<script>
$(document).ready(function() {
onHeadlinesLoad();
});
</script>
我不知道为什么它不起作用,所以我请求你帮忙。
提前致谢。
最好的问候,约翰。
答案 0 :(得分:0)
使用jQuery mobile更新列表后,请考虑触发“创建”事件,但这已过时,请使用
.page()
你的名单上的是这样的:
$('ul#headlineslist').page();