开发者

Implementing deeplinking with multiple levels

I need to implement deeplinking for开发者_如何学运维 my site as it's built heavily in AJAX. I understand the basic idea and have got deeplinking implemented for my top level nav. Problem is my site has multiple levels. A user can click on the top nav, which adds to the hash and then click on a secondary nav and a tertiary nav. I also need to add this secondary and tertiary nav click in to the hash...and then also be able to remove that item when the user clicks back on a primary nav item. I can't think of a way to do this...any ideas?

Oh and the code (jQuery) I'm using to achieve the hashing on the primary nav is:

updateHash : function(hash) {
    var hashHistory = [];
    location.hash = hash;
}


I' not quite sure what you are looking for. Maybe you should show some concrete examples. Until then how about something like this:

function updateHash(hashPath) {
   if (hashPath.charAt(0) == "/") {
     location.hash = "#" + hashPath;
     return;
   }

   var currentHash = location.hash.split(/\//);
   if (currentHash[0]) currentHash[0] = currentHash[0].substr(1); // Loose the #

   var relHash = hashPath.split(/\//);

   var part;
   while (part = relHash.shift()) {
     if (part == "..") {
        currentHash.pop();
     } else {
        currentHash.push(part);
     }
   }

   if (currentHash.length > 0)
      location.hash = "#" + currentHash.join("/");
   else
      location.hash = "";
}

Examples:

updateHash("/topLevelItem");
alert(location.href); // "www.example.com/#/topLevelItem"

updateHash("secondLevelItem");
alert(location.href); // "www.example.com/#/topLevelItem/secondLevelItem"

updateHash("thirdLevelItem");
alert(location.href); // "www.example.com/#/topLevelItem/secondLevelItem/thirdLevelItem"

updateHash("../differentThirdLevelItem");
alert(location.href); // "www.example.com/#/topLevelItem/secondLevelItem/differentThirdLevelItem"

updateHash("../../differentSecondLevelItem");
alert(location.href); // "www.example.com/#/topLevelItem/differentSecondLevelItem"

updateHash("../anotherSecondLevelItem/anotherThirdLevelItem");
alert(location.href); // "www.example.com/#/topLevelItem/anotherSecondLevelItem/anotherThirdLevelItem"

updateHash("..");
alert(location.href); // "www.example.com/#/topLevelItem/anotherSecondLevelItem"
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜