3

我已经成功实现了 jQuery BBQ 插件来构建一个快速原型，但是我遇到了一个与我的特定设置相关的小问题：

  • 其中一个页面"#catalogue"包含一个项目网格，这些项目使用函数"randomItems()"随机生成，在 hashchange 时触发（当来自另一个页面时）。
  • 然后，用户单击网格中的任何这些项目以查看#detailspage。
  • 单击浏览器的后退按钮后，我希望用户查看#catalogue页面（工作正常）但阻止页面生成一组新的随机项目加载（所以保留最后显示的任何项目）。

有没有办法知道用户点击了后退按钮，所以在这种情况下我不会触发“randomItems()”函数？

4

3 回答 3

0

您需要将项目randomItems()放在缓存中：

// save your records here in the cache
var items = [];

$(window).on('hashchange', function(){
    var page = window.location.hash.replace(/^#/, '');

    // check first if items has already records in it and check if page is #catalogue
    // if not then call randomItems()
    if (page === 'catalogue' && items.length === 0) {
        items = randomItems();
    }

    // your code here follows
});
于 2013-05-16T16:16:41.233 回答
0

Believe bbq 允许您设置和获取 url 参数，您可以使用这些参数来确定是否需要随机化。当用户单击目录链接时，URL 类似于：

http://yoururl.com/#catalog

所以这是目录的“根”网址，只要网址是这个，您就可以随机化项目，在随机化项目后，您会在网址中添加一个参数，这样它就变成了：

http://yoururl.com/#catalog?r=1

这样，当用户离开并查看某个项目然后单击返回历史 url 时，将包含r=1并且因此您不会处理 randomise 函数。

function randomiseItems()
{
  // we do not want to randomise
  if(urlParamIsSet("r")) return; 

  // set url param so gets stored in history (replacing current url)
  urlSetParam("r",1); 

  //-- do your code here
}

而不是urlParamIsSet/urlSetParam使用 bbq 为您提供的任何功能来操作 url。

于 2013-07-09T03:59:54.607 回答
0

使用浏览器的本地存储来保存项目。首先创建对象的 javascript 表示。然后将其存储在 localStorage 中。在页面加载时检索。请注意，您必须对复杂对象进行字符串化才能存储它，因为存储只接受键值对

这是一个一般模式

var foo;
window.onpageload = function(){
   if(localStorage["foo"] == '' | localStorage["foo"] == undefined){
     foo = getrandomItems(); //possibly an ajax call;
     localStorage["foo"] = JSON.stringify(foo);
   else{
     foo = JSON.parse(localStorage["foo"]);
   }
};

有关详细信息，请参阅http://diveintohtml5.info/storage.html和在 HTML5 localStorage 中存储对象

于 2013-06-14T00:46:58.907 回答