指向另一个元素的href在Polymer中无效 [英] href to another element does not work in Polymer

查看:81
本文介绍了指向另一个元素的href在Polymer中无效的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用Polymer Starter Kit及其应用程序路由器创建了一个项目.

I created a project using the Polymer Starter Kit, with its app-router.

我的my-app.html具有类似视图的选择器.

My my-app.html has the selectors for the views like so..

<iron-pages role="main" selected="[[page]]" attr-for-selected="name">
      <my-view1 name="view1"></my-view1>
      <my-view2 name="view2"></my-view2>
      <my-view3 name="view3"></my-view3>
      <my-view4 name="view4"></my-view4>
      <my-view5 name="view5"></my-view5>
      <my-view6 name="view6"></my-view6>
    </iron-pages>

我有一个组件my-view1.html,其中有带有href标签的div

I have a component my-view1.html, within which I have div with href tag

<div>God 1 <a href="#gotogod" class="link">Jump to example</a> </div>

我在文档中的其他地方

<p id="gotogod">
  God is great
</p>

虽然我没有遇到任何错误,但是当我单击链接时,它并没有跳到该段落.当我将鼠标悬停在链接上时,我会得到

While I dont get any errors, it doesnt jump to the paragraph when I click the link. When I hover over the link, I do get

http://localhost:8080/view1#gotogod

但是页面没有跳到那个地方.

But the page doesnt jump to that spot.

我尝试了href的各种组合,但没有运气.

I have tried various combinations for the href without luck.

请帮助.

推荐答案

HTML元素:

<a on-click="scrollIntoView" section-id="gotogod">

JavaScript函数:

Javascript Function:

scrollIntoView(e) {
   let sectionId = e.target.getAttribute('section-id');
   this.$[sectionId].scrollIntoView();
}

这篇关于指向另一个元素的href在Polymer中无效的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆