11

更新:对不起,我不小心将该data-dom-cache="true"行复制到我的 content-div 中。应用程序从 dom 加载而不是新内容似乎非常合乎逻辑!我已将其更改为false,现在它可以完美运行。

谢谢。

我有一个动态生成的列表。如果有人单击列表中的条目,用户将被重定向到加载数据的新页面(动态)。加载的数据取决于用户单击的列表条目。

当应用程序第一次加载时,一切正常。但是,当用户单击另一个列表条目时,会显示与第一次运行时相同的数据。

我玩过.empty()jQuery 中的函数(清除 div 并附加新数据),但它不起作用。

编辑:

我的 headers.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>

我不知道为什么它不起作用,所以我请你帮忙。

提前致谢。

最好的问候,约翰。

4

1 回答 1

0

使用 jQuery mobile 更新列表后,请考虑触发“ create ”事件,但该事件已过时,因此请使用

.page() 

在你的名单上是这样的:

$('ul#headlineslist').page();
于 2012-05-21T21:39:07.113 回答