当前位置：文江博客话题详情

锚标签列表创建

发布于 2024-11-17 15:00:06 字数 426 浏览 5 评论 0原文

我正在从 MySQL/PHP 查询创建锚标记列表；锚标记调用 JavaScript 函数。

我的“第 22 条军规”是：

href="#" 使页面在每次单击锚标记之一时跳转到顶部（非常烦人），
删除 href="# " 意味着当锚标记悬停在其上时光标不会改变，该锚标记也不具有锚标记的外观。

我知道有一种方法可以用 JavaScript（可能是 jQuery）来处理这个问题，但我现在不记得如何处理。不过，我确实更喜欢一种不需要我了解 JavaScript 的更简单的 HTML 修复（如果存在的话）。

编辑：
“不需要我了解 JavaScript” ==“不需要对 JavaScript 进行大量更改。”

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

最佳男配角 2024-11-24 15:00:06

在您的 javascript 函数中，您应该返回 false，或者对于 jquery，您可以使用 preventDefault()

示例：

$('a').click(function(event) {
    event.preventDefault();
    // do something
});

或者在您的情况下：

<a href=“#” onclick="foo();return false;">

或者将 href 更改为 javascript:void(0)：

<a href="javascript:void(0)" onclick="foo();">

理想情况下，您的链接会在没有 javascript 的情况下降级，因此第三个选项通常会被避免。

In your javascript function you should return false, or with jquery you can use preventDefault()

Example:

$('a').click(function(event) {
    event.preventDefault();
    // do something
});

Or in your case:

<a href=“#” onclick="foo();return false;">

Or change the href to javascript:void(0):

<a href="javascript:void(0)" onclick="foo();">

Ideally, your link degrades without javascript, so the third option will usually be avoided.

回复收藏 0 原文

淡淡離愁欲言轉身 2024-11-24 15:00:06

为您提供更简单的 HTML 修复：就个人而言，对于普通测试链接，我只使用 href=""

对于指向 javascript 函数的链接，我倾向于使用 href="javascript:;"。不管怎样，你都会停止页面跳转。

回复收藏 0 原文

滥情哥ㄟ 2024-11-24 15:00:06

在 onclick 之后或在 foo() 函数中返回 false。

回复收藏 0 原文

咿呀咿呀哟 2024-11-24 15:00:06

您需要在点击事件处理程序中的某个位置调用 event.preventDefault(); 。在普通的 javascript 中，可以像这样完成：

<script type="text/javascript">
  function foo(e) {
    e.preventDefault();
    // other code
  }
</script>
<a href="#" onclick="foo(e);"></a>

此外，您还可以返回 false：

<a href="#" onclick="foo();return false;/>

这也可以在 jQuery 中非常简单地完成：

$('.mylink').click(function(e) {
  e.preventDefault();
  // other code
});

使用 return false; 的缺点是这也会阻止该事件避免 DOM 冒泡。如果您不关心事件冒泡，可以使用 false，但我个人认为最好使用 event.preventDefault(); ，除非您特别想停止事件冒泡。

You need to call event.preventDefault(); somewhere in your click event handler. In vanilla javascript, this can be done like so:

<script type="text/javascript">
  function foo(e) {
    e.preventDefault();
    // other code
  }
</script>
<a href="#" onclick="foo(e);"></a>

Additionally, you can also return false:

<a href="#" onclick="foo();return false;/>

This can be also done in jQuery pretty simply:

$('.mylink').click(function(e) {
  e.preventDefault();
  // other code
});

The downside of using return false; is that is also prevents the event from bubbling up the DOM. If you don't care about event bubbling it's okay to use false, but personally I feel that it's better to use event.preventDefault(); unless you specifically want to stop event bubbling as well.

回复收藏 0 原文

烟雨凡馨 2024-11-24 15:00:06

<html>
    <head>

    </head>
    <body>
    <style>
    a {
        text-decoration: underline;
    }
    a:hover {
        text-decoration: underline;
    }
    </style>
    <script type="text/javascript">
      function foo() {
        alert('Hello World');
      }
    </script>
    <a onclick="foo();">Click Here</a>
    </body>
    </html>

只需添加 CSS 并删除 href 似乎就可以了。

<html>
    <head>

    </head>
    <body>
    <style>
    a {
        text-decoration: underline;
    }
    a:hover {
        text-decoration: underline;
    }
    </style>
    <script type="text/javascript">
      function foo() {
        alert('Hello World');
      }
    </script>
    <a onclick="foo();">Click Here</a>
    </body>
    </html>

Just adding the CSS and removing the href seems fine.

回复收藏 0 原文

~没有更多了~