Суть проблемы такова:
Пытаюсь реализовать навигацию на JQuery (причина - нужно в итоге создать возможность проигрывания музыки при переходе по страницам, ибо сайт музыкальной тематики). Сейчас себя ведет система, которую я взял на основе постов на хабре - мягко говоря некорректно. Часто при переходам по страницам браузер вываливается в "ожидание доступного сокета". Так же, если находясь на одной из страниц, кликать по ссылке на нее, то в DOM начинают добавляться элементы в геометрической прогрессии. Помимо всего, не могу выполнить, как не крути eval для скриптов, которые размещены на нужных страницах в тегах script
Сейчас скрипт имеет такой вид. Сразу извиняюсь за вопросы, но ранее я дальше php не вылезал. Сейчас пришлось.
$(function() {
String.prototype.decodeHTML = function() {
return $("<div>", {html: "" + this}).html();
};
var $main = $("main"),
init = function() {
},
ajaxLoad = function(html) {
document.title = html
.match(/<title>(.*?)<\/title>/)[1]
.trim()
.decodeHTML();
init();
},
loadPage = function(href) {
//console.log(($main.load).html());
$main.load(href + " main>*", ajaxLoad);
//console.log(href);
//eval($("script").text());
$("main").css("display", "none");
$("main").fadeOut(600);
$("main").fadeIn(600);
//console.log(($main));
console.log($("script"));
jQuery.each( $("script"), function( i, val ) {
eval($(val).text());
})
};
init();
$(window).on("popstate", function(e) {
if (e.originalEvent.state !== null) {
loadPage(location.href);
// console.log("5");
}
});
$(document).on("click", ".transition", function() {
var href = $(this).attr("href");
if (href.indexOf(document.domain) > -1
|| href.indexOf(':') === -1)
{
history.pushState({}, '', href);
loadPage(href);
return false;
}
});
});