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 回答