如何创建空的HTML锚点，使页面在单击时不会“跳起”?

I'm working on some JQuery to hide/show some content when I click a link. I can create something like:

当我点击一个链接时，我正在使用JQuery来隐藏/显示一些内容。我可以创建如下内容:

<a href="#" onclick="jquery_stuff" />

But if I click that link while I'm scrolled down on a page, it will jump back up to the top of the page.

但是如果我在页面上滚动的时候点击那个链接，它会跳回到页面的顶部。

If I do something like:

如果我做的是:

<a href="" onclick="jquery_stuff" />

The page will reload, which rids the page of all the changes that javascript has made.

页面将重新加载，这将删除javascript所做的所有更改。

Something like this:

是这样的:

<a onclick="jquery_stuff" />

Will give me the desired effect, but it no longer shows up as a link. Is there some way to specify an empty anchor so I can assign a javascript handler to the onclick event, without changing anything on the page or moving the scrollbar?

会给我想要的效果，但不再以链接的形式出现。有没有一种方法可以指定一个空锚，这样我就可以为onclick事件分配一个javascript处理程序，而无需更改页面上的任何内容或移动滚动条?

11 个解决方案

#1

Put a "return false;" on the second option:

在第二个选项上写上“return false”:

<a href="" onclick="jquery_stuff; return false;" />

#2

You need to return false; after the jquery_stuff:

你需要返回false;jquery_stuff后:

<a href="no-javascript.html" onclick="jquery_stuff(); return false;" />

This will cancel the default action.

这将取消默认操作。

#3

You can put simply as like below:

你可以简单地写如下:

<a href="javascript:;" onclick="jquery_stuff">

#4

jQuery has a function built in for this called preventDefault which can be found here: http://api.jquery.com/event.preventDefault/

jQuery内置了一个名为preventDefault的函数，可以在这里找到:http://api.jquery.com/event.preventDefault/

Here's their example:

这是他们的例子:

<script>
$("a").click(function(event) {
    event.preventDefault();
});
</script>

You can also build the link like this:

你也可以建立这样的链接:

<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>

#5

Check eyelidlessness' comment (use a button, not an anchor). Was just about to post the same advice. An anchor that doesn't link to a resource and merely executes a script should be implemented as a button.

检查眼睑缺失的注释(使用按钮，而不是锚)。我们正要发布同样的建议。锚点不链接资源，只执行脚本，应该作为按钮来实现。

Stop putting your event handlers in HTML, and stop using anchor tags that don't serve anchor semantic purposes. Use a button and add the click handler in your Javascript. Example: HTML <button id="jquery_stuff">Label</button> and JavaScript $('#jquery_stuff').click(jquery_stuff);. You can use CSS to style the button to look like a link, by removing padding, borders, margin and background-color, then adding your link styles (eg. color and text-decoration). – eyelidlessness Oct 19 '10 at 17:40

停止将事件处理程序放在HTML中，停止使用不为锚定语义目的的锚标记。使用一个按钮并在Javascript中添加单击处理程序。示例:HTML 和JavaScript $('#jquery_stuff').click(jquery_stuff);您可以使用CSS将按钮样式化为类似于链接的样式，方法是删除填充、边框、空白和背景颜色，然后添加链接样式(例如)。颜色和文字修饰)。- 10年10月19日17:40无眼睑

#6

<a href="javascript:;" onclick="jquery">link</a>

href requires something in there if you want it to not pop up errors in validators for html. The javascript:; is a good place holder.

如果你想要它不要在验证器中弹出html错误，href需要一些东西。javascript:;是一个好地方的持有者。

If you really want to use the #:

如果你真的想用#:

<a href="#me" name="me" onclick="jquery">link</a>

Be careful with the return false;, it halts default behaviours of whatever you are doing.

小心返回false，它会停止你正在做的任何事情的默认行为。

Also if your js is like a submit you may run into problems in internet explorer.

另外，如果你的js像一个提交，你可能会在internet explorer中遇到问题。

#7

<a href="javascript:// some helpful comment " onclick="jquery_stuff" />

#8

-1

I usually use a <span> and style it to look like a link when I need to accomplish something like this.

我通常使用，并且在需要完成类似的操作时，它看起来像一个链接。

#9

-1

  <a href="#" class="falseLinks">Link1</a>
  <a href="#" class="falseLinks">Link2</a>

etc..

等。

JQUERY:

  $(function() {
    $("a.falseLinks").click(function() {
      // ...other stuff you want to do when links is clicked

      // This is the same as putting onclick="return false;" in HTML
     return false;
    })
  });

@eyelidlessness was a bit douchy in the way he said it but he was right. This is the cleanest way to do it. Why use jQuery if you're then gonna go back to vanilla Javascript for stuff jQuery does easier and cleaner?

@ dless在他说话的方式上有点模棱两可，但他是对的。这是最干净的方法。为什么要使用jQuery呢?

#10

-2

Usually I do:

我通常做的事:

<a style="cursor:pointer;" onclick="whatever();">Whatever</a>

#11

-4

How about this:

这个怎么样:

<a href="#nogo" onclick="foo();">some text</a>

#1