Tag: breadcrumbs

使用javascript在客户端动态创建面包屑

我想使用java脚本在客户端动态创建面包屑 。 面包屑将是用户在导航时遵循的路径 ： 主页>关于我们>我们的历史.. 将在用户导航的序列中的每个页面上生成锚标签。 现在我可以轻松地使用服务器端技术创建这些面包屑，但我想在客户端的每个页面上动态生成它。 现在我不确切知道如何实现它。 我心中的一些逻辑是： 在java脚本中创建一个具有名称和值对的对象类型变量 ，其中name是当前页面的名称， value是该页面的url 。 现在，在从一个页面导航到另一个页面时，使用查询字符串传递此对象变量。 然后在第二页中从查询字符串中获取该对象变量，并从该对象中提取名称和值对，然后使用该对创建锚并将其添加到目标div（占位符）。 再次当用户转到另一个页面时，为对象变量中的最后一页添加所有先前页面的名称和值对以及当前页面的名称和值对 ，并使用查询字符串将其传递到下一页。 现在在下一页中做同样的事情并创建锚点。 我在这里使用html5客户端存储的相似之处： html： Page1 Page2 Page3 JS： $(document).ready(function(){ bindEventToNavigation(); }); function bindEventToNavigation(){ $.each($(“#navigation_links > li”), function(index, element){ $(element).click(function(event){ breadcrumbStateSaver($(event.currentTarget).html()); showBreadCrumb(); }); }); } function breadcrumbStateSaver(text){ //here we’ll check if the browser has storage capabilities if(typeof(Storage) != “undefined”){ if(sessionStorage.breadcrumb){ […]