Question

我正在使用带有模式弹出库的html5-css3模板，当我点击任何图像时，它会跳转到网站顶部。这是因为标签，我不知道如何让它正常工作。请帮忙！我是编码的新手，现在我搜索了几天的答案，但没有找到解决方案。

这是html代码的样子：

<a href="#" data-reveal-id="#modal-01"><img src="images/portfolio/canandreu.jpg" alt=""/></a>

Answer 1

您可以使用href="JavaScript:Void(0);"

使用JavaScript:Void(0)，您可以消除不需要的内容副作用，因为它将返回未定义的原始值。

<a href="JavaScript:Void(0)" data-reveal-id="#modal-01"><img src="images/portfolio/canandreu.jpg" alt=""/></a>

Answer 2

你可以用要么

但我建议使用用户onclick =＆＃34; return false;＆＃34;这将解决您的问题

Answer 3

如果您为每个modal-link标记添加a类，那么您可以使用以下代码：

var modalLinks = document.querySelectorAll('.modal-link');
Array.prototype.forEach.call(modalLinks, function(el, i){
  el.addEventListener('click', function(e){
    e.preventDefault();
  });
});

这会阻止每个具有班级modal-link的元素将您带到页面顶部。

href hashtag＃使模式弹出库单击以跳转到站点顶部

3 个答案: