点击<a href="#">

Question

I have the following code:

<p>
    <a href="#" id="sobo-einblenden">einblenden</a>
    <a href="#" id="sobo-ausblenden">ausblenden</a>
</p>
<div id="sozialbookmarks">
    <p>
        <b>Bereich für social bookmarks</b><br>
        Hier kommen nun die üblichen Verdächtigen und Logos dazu.<br>
        Nicht vergessen, meine Seite zu bookmarken!
    </p>
</div> 
<div id="sozialbookmarks2">
    <p>
        <b>Bereich für social bookmarks</b><br>
        Hier kommen nun die üblichen Verdächtigen und Logos dazu.<br>
        Nicht vergessen, meine Seite zu bookmarken!
    </p>
</div>

When I click on <a href="#" id="sobo-einblenden">einblenden</a> in the browser I will see: site.php#. How can I make it so that the # is not added to the URL?

Answer 1

使用event.preventDefault（）

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

Answer 2

如Dhara Parmar's answer所述，您可以在所有<a>元素上使用简单的jQuery事件侦听器，以防止在单击时执行默认操作（转到哈希）。

这是使用vanilla JavaScript实现同样目标的一种方法：

// all anchors
var elements = document.getElementsByTagName("a");

for (var i = 0; i < elements.length; i++) {
  // attach event to each anchor tag
  elements[i].addEventListener("click", function(event) {
    // prevent default action when clicked
    event.preventDefault();
  });
}

关于如何preventDefault()使用可以found here.

的vanilla JavaScript的类似问题