如何在 jquery（移动）中刷新 DIV？

Posted 2023-03-31

【中文标题】如何在 jquery（移动）中刷新 DIV？

【英文标题】：How to refresh a DIV in jquery (mobile)?

【发布时间】：2012-05-21 21:30:49

【问题描述】：

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

谢谢。

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

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

我已经使用了 jQuery 中的 .empty() 函数（清除 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 文件中的 sn-p，数据应在其中显示（并在用户每次新点击时刷新）：

<div data-role="content" id="headlineshome"></div>
<script>
  $(document).ready(function() 
    onHeadlinesLoad();
  );
</script>

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

提前致谢。

最好的问候，约翰。

【问题讨论】：

很抱歉问这个问题，但您确定这不是缓存问题吗？也许移动浏览器认为他比“cache: false”-Param 更聪明？

***.com/questions/5562461/…

使用 jQuery mobile 您需要触发“create”事件才能进行刷新。刷新移动设备上的所有内容会降低性能:)

onHeadlinesLoad 的双重声明是怎么回事？你可能想先整理一下。然后，一旦完成，你告诉我们你在第二个 onHeadlinesLoad 中突然使用的 hID 来自哪里。

@Lukx：很抱歉双重声明，是复制失败。我已经在我的问题中纠正了这一点。 hID 是从第一个函数 (function HeadlinesLoad()) 中的 onclick 函数中检索的，该函数是从我的 php 文件中检索的。

【参考方案1】：

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

.page() 

在你的清单上是这样的：

$('ul#headlineslist').page();

【讨论】：

谢谢。但我不想在列表上追加，我想用新内容刷新#headlineshome（应该在用户单击另一个列表条目时生成）。

现在我已经用 "$("#categorieshome").html(html).page();" 尝试过了...但是这一行没有产生任何结果（现在没有数据显示）。

如果你尝试 $('#categorieshome').html(html).trigger('create') 会怎样？

它运行，但是当用户点击另一个列表条目时也没有刷新。