我写了一些简单的代码来加载视图。当我加载视图时,我需要解析需要附加侦听器的<a>
标记的视图。最初,我解析整个文档,但这会导致一些奇怪的错误,整个文档将被解析n次,其中n是我点击超链接的次数。非常奇怪的东西。现在我试图只解析内部视图。我怎样才能告诉jquery从我提供的jquery元素开始(我加载的视图)。
$(document).ready(function () {
var viewRoot = $("[view='']");
function attachHyperLinkListener() {
$('a').filter(function (index, element) {
var href = $(this).attr('href');
console.log('analyzing ' + href);
if ( href.substring(0, 2) == "#/" ) {
console.log('attaching listener');
return (href.substring(0, 2) == "#/");
}
return false;
}).click(function (e) {
e.preventDefault();
var href = $(this).attr('href').substring(2)
loadPage(href);
var stateObj = {'href' : href};
window.history.pushState(stateObj, '', href);
});
}
function loadPage(href) {
console.log('loading ' + href );
$.get(href, null, function (data) {
var view = $.parseHTML(data)
viewRoot.html(view);
//attachHyperLinkListener(); // running this causes that strange error
// how can I run $('a').click(...) on 'view' only?
});
}
$(window).on('popstate', function (e) {
loadPage(e.originalEvent.state.href);
});
window.history.pushState({'href':'/'}, '', ''); // push the original page
attachHyperLinkListener();
});
</script>
[edit]我认为错误的发生是因为同一个<a>
标签上有n个侦听器。
答案 0 :(得分:1)
viewRoot.on('click', 'a', function () {
// here you go
});