我的问题很简单,但我很难找到答案.我正在使用meteor来创建一个网站.使用我的流星我正在使用铁路由器来浏览我的页面AKA模板.我的头标始终保持不变.我只是通过使用铁制路由器更改主体中包含的模板来更改主体.我有一个包含带有id的锚标签的页面,我希望当我的模板由于用户导航到该页面而更改时页面会自动滚动到我的网页上的某个锚点.不幸的是,我只能提供代码片段,因为我正在为公司做网页而不想泄露信息.我认为代码片段就足够了.
我在AfterRun上尝试过铁路由器:
Router.map(function(){
this.route("cpdEvents", {
path: "cpd.html#events",
onAfterRun: function() {
e.preventDefault();
$('html, body').animate({
scrollTop: $("a[name=events]").offset().top
}, 600);
}
});
});
我已经尝试过meteor的模板渲染功能:
if (Meteor.isClient) {
Template.cpd.rendered = function (){
e.preventDefault();
$('html, body').animate({
scrollTop: $("a[name=events]").offset().top
}, 600);
}
}
我的网站结构的例子,显然不是一切.只是索引html和用户导航到的cpd.html.上面已经显示了JavaScript.
index.html的:
<head>
<meta ..... />
<title></title>
</head>
<body>
{{> index}}
</div>
</body>
cpd.html:
<template name="cpd">
....
<a name="events"></a>
....
</template>
只是额外的信息:
我正在使用的Meteor版本包含jquery库,我测试了我的jquery工作.
如果我没有使用meteor并使用例如HTML.这可以通过在网址末尾添加"#"和ID来轻松完成.例如www.example.com/cpdEvents#events