javascript - 不想页面跳转

标签 javascript jquery css page-jump

上一个问题已解决 @ use selectors in variable jquery在同一个coe上

我必须实现类似 this 的功能 这是使用我不理解的大 jquery 代码

这是我的 jsfiddle 我有相同的功能但是当它被点击时页面跳转到那个元素 我不想让页面跳转,我需要淡入淡出

$(".show").click(function() {
    var link = $('this').attr('href');
  $(link).show();

});

$(".close").click(function() {
  $(this).closest("div.popupbox").hide();
});

和html

<a href="#popup" id="show" class="show">a</a>
<a href="#popup1" id="show1" class="show">b</a>
<a href="#popup2" id="show2" class="show">c</a>

我想在点击 anchor 时显示#popup,但不想页面跳转/滚动到那个id 我在 fiddle 中给出了 top:10000px 来测试这个问题,因为在我的原始页面中它移动到特定元素

fiddle 上的完整代码我想要this functionality

最佳答案

试试这个:

$(".show").click(function(e) {
  e.preventDefault();
  var link = $(this).attr('href'); //<----remove quotes in $('this')
  $(link).fadeIn(); // <-------------use fadeIn() instead
});

$(".close").click(function(e) {
  e.preventDefault();
  $(this).closest("div.popupbox").hide();
});

并将 top:100000px 调整为较小的值,例如 50px

关于javascript - 不想页面跳转,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15384033/

相关文章:

javascript - Promise 是单播还是广播?

javascript - 如何 chop 表格单元格中的文本?

javascript - JQuery - 适用于 Firefox,但不适用于 Safari、Chrome 或 Mobile

css - 在 IE11 F12 开发者工具中查看 CSS 样式表

javascript - 添加和删​​除类似乎会导致 dom 中出现问题

javascript - 仅当 div 进入视口(viewport)时才使用 bootstrap 4 动画对 Angular 线 div

javascript - anchor 标记 href 与设置的内容不同

javascript - 从 Angular 2 访问 jQuery 函数中设置的变量

jquery - 仅对我单击的框应用颜色

jquery - 如何更新以编程方式更改的元素的 v-model?