Есть ли способ удалить%20 из динамически созданных хлебных крошек?
Итак, я возился с этой записью Dynamic Breadcrumbs и столкнулся с проблемой, когда если в имени каталога есть пробел, то%20 добавляется к фактической видимой крошке. Будет ли это удалено с помощью функции decodeURI() или есть лучший способ?
Вот JS:
var crumbsep = " • ";
var precrumb = "<span class=\"crumb\">";
var postcrumb = "</span>";
var sectionsep = "/";
var rootpath = "/"; // Use "/" for root of domain.
var rootname = "Home";
var ucfirst = 1; // if set to 1, makes "directory" default to "Directory"
var objurl = new Object;
// Grab the page's url and break it up into directory pieces
var pageurl = (new String(document.location));
var protocol = pageurl.substring(0, pageurl.indexOf("//") + 2);
pageurl = pageurl.replace(protocol, ""); // remove protocol from pageurl
var rooturl = pageurl.substring(0, pageurl.indexOf(rootpath) + rootpath.length); // find rooturl
if (rooturl.charAt(rooturl.length - 1) == "/") //remove trailing slash
{
rooturl = rooturl.substring(0, rooturl.length - 1);
}
pageurl = pageurl.replace(rooturl, ""); // remove rooturl from pageurl
if (pageurl.charAt(0) == '/') // remove beginning slash
{
pageurl = pageurl.substring(1, pageurl.length);
}
var page_ar = pageurl.split(sectionsep);
var currenturl = protocol + rooturl;
var allbread = precrumb + "<a href=\"" + currenturl + "\">" + rootname + "</a>" + postcrumb; // start with root
for (i=0; i < page_ar.length-1; i++)
{
var displayname = "";
currenturl += "/" + page_ar[i];
if (objurl[page_ar[i]])
{
displayname = objurl[page_ar[i]];
}
else
{
if (ucfirst == 1)
{
displayname = page_ar[i].charAt(0).toUpperCase() + page_ar[i].substring(1);
}
else
{
displayname = page_ar[i];
}
}
if ( i < page_ar.length -2 )
{
allbread += precrumb + crumbsep + "<a href=\"" + currenturl + "\">" + displayname + "</a>" + postcrumb;
}
else
{
allbread += crumbsep + displayname;
}
}
document.write(allbread);
Если будет использоваться decodeURI(), куда именно он пойдет? Кроме того, более не имеет значения, есть ли вариант, который вы могли бы добавить к приведенному выше коду, который бы позволял включать фактическую страницу внутри каталога в панировочные сухари как последний элемент вместо последнего каталога? Не очень важно, но подумал, что я тоже буду спрашивать. Спасибо за любой вклад!
2 ответа
Да, decodeURI
сделает свое дело. Вы можете добавить строку displayname = decodeURI(displayname);
прямо перед if
это читает if ( i < page_ar.length -2 )
:
...
displayname = decodeURI(displayname);
if ( i < page_ar.length -2 )
...
Обратите внимание, что с displayname
а также currenturl
в конечном итоге непосредственно внедряются в необработанную строку HTML, любые специальные символы HTML должны быть в первую очередь экранированы, в противном случае вы открыты для некоторых атак XSS (представьте, что некоторые злоумышленники размещают ссылку на ваш сайт, например, yoursite.com/valid/page/%3Cscript%3Ealert%28%22Oh%20no%2C%20not%20XSS%21%22%29%3C%2Fscript%3E). Один из самых простых способов сделать это покрыт этим ответом, хотя он требует jQuery.
Если вы хотите, чтобы текущая страница была включена в хлебные крошки, я считаю, что достаточно изменить цикл, чтобы перейти от 0 до page_ar.length
вместо page_ar.length - 1
:
...
for (i=0; i < page_ar.length; i++)
...
Вы должны использовать decodeURIComponent()
не decodeURI()
за это. Немного трудно понять, что вы пытаетесь сделать, но вот более простой код, который даст вам массив "каталогов" в текущем URI, декодированный:
var dirs = location.pathname.split('/');
for (var i=0,len=dirs.length;i<len;++i){
dirs[i] = decodeURIComponent(dirs[i]);
}