Question

我有一个jquery移动网站 - 一个单页面 - 我在标题中的文本有问题。这是一个简单的网站，只有5页，所有div都是data-role = page。当页面加载时，我使用$ .get来检索由外部PHP页面生成的JSON格式的数组。进程页面使用url变量来确定从db：

中检索哪些数据

$.get("ajax/siteInfo.php?id=" + getURLvar( 'id' ), function(siteData){
  sessionStorage.siteTitle = siteData.siteTitle;
}, "json");

有比1项更多的数据，但为了简单起见，我正在缩短它。成功检索JSON数组，我可以在控制台中看到所有数据键值对。

还想指出我有一个函数在加载网站页面时返回url var（/index.html?id=2001）：

function getURLvar( name )
{
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1];
}

现在，我想在5个页面中的每个页面中使用sessionStorage.siteTitle：

<div data-role="header">
  <h1><script>document.write(sessionStorage.siteTitle);</script></h1>
</div>

第一次加载页面时这是有效的，但是如果我更改url var id并重新加载页面，则标题仍保留在上一页中 - 即使我可以看到已从JSON数组中检索到正确的标题。就像sessionStorage.siteTitle被缓存一样，所以我第一次使用新的url var id重新加载时它不会改变 - 但是如果我再次重新加载则会显示新的标题。

希望这是有道理的。我把头发拉了出来。如果有人对此有所了解 - 或者甚至是在

标题中使用一致标题的替代和更合适的方法

Answer 1

在初始页面加载后，javascript的那一点永远不会再次处理。它只设置一次头，它成功。之后，您必须手动更新h1：

$.get("ajax/siteInfo.php?id=" + getURLvar( 'id' ), function(siteData){
    $('div[data-role="header"] h1').html(siteData.siteTitle);
}, "json");

Answer 2

我会在页面显示甚至被触发时替换文本。当请求页面并向用户显示时，将触发此事件。在这里，我将事件附加到所有页面：

$('div[data-role="page"]').live('pageshow', function() {
     // replace header text
     $(this).children('div[data-role="header"] h1').html(sessionStorage.siteTitle);
});

所有页面上的Jquery一致标题标题文本

2 个答案: