Ich möchte einen Link, der nichts tut. Ich will das nicht:

<a href="#">

denn dann wird die URL something.com/whatever/#.

Der einzige Grund, warum ich einen Link möchte, ist, dass der Benutzer sehen kann, dass er auf den Text klicken kann. JavaScript wird verwendet, um eine Aktion auszuführen, sodass ich den Link nicht brauche, um irgendwohin zu gelangen, aber ich brauche ihn, um wie ein Link auszusehen!

Ich könnte ein Datenattribut verwenden und mir CSS sagen, damit Elemente wie Links aussehen, wenn sie dieses Attribut haben, aber es scheint ein bisschen übertrieben.

Das Folgende verhindert, dass Ihr href ausgeführt wird

<a href="#" onclick="return false;">

Wenn Sie jQuery verwenden, event.preventDefault()kann verwendet werden

Versuche dies:

<a href="javascript:void(0);">link</a>

In HTML5 ist dies sehr einfach. Lassen Sie einfach das hrefAttribut weg .

<a>Do Nothing</a>

Von MDN auf das Attribut a tag href :

href

Dies war das einzige erforderliche Attribut für Anker, die einen Hypertext-Quelllink definieren, wird jedoch in HTML5 nicht mehr benötigt.

Was ist mit dem Handcursor beim Schweben?

Die Standardstile für einen Browser ändern den Cursor möglicherweise nicht in einen Zeiger für aTags mit der Nummer href. Sie können dies universell mit dem folgenden CSS ändern.

a {
    cursor: pointer;
}

<a>Do Nothing</a>

Es ist jedoch wahrscheinlich besser, selektiver vorzugehen und es nur auf die Elemente anzuwenden, denen Sie Ereignishandler hinzufügen möchten.

Was ist damit, es tab-fokussierbar zu machen?

Fügen Sie einfach tabindex="0"dem Element hinzu.

<a tabindex="0">Do Nothing</a>

Ist es sinnvoll, ein aTag ohne Link zu verwenden?

Normalerweise nein, es ist wahrscheinlich besser, buttonstattdessen ein Element zu verwenden und es mit CSS zu formatieren. Vermeiden Sie jedoch, was auch immer Sie verwenden, die Verwendung eines beliebigen Elements, divwenn dies möglich ist, da dies überhaupt nicht semantisch ist.

Machen Sie keinen Link daraus (obwohl dies bevorzugt wird) und gestalten Sie ihn mit CSS so, dass er wie ein Link aussieht:

p.not-a-link { text-decoration: underline; cursor: pointer } 

Oder machen Sie es einfach zu einem Link und lassen Sie die Javascript-Funktion, die verwendet wird e.preventDefault(), um den Link zu verhindern.

Fügen Sie außerdem den Link zu hinzu, hrefdamit Benutzer ohne aktiviertes JS ihn weiterhin verwenden können (als Fallback).

<a href="javascript:;">Link text</a> - das benutze ich normalerweise

Wir können dies erreichen, indem wir Javascript void verwenden, bei dem normalerweise ein Ausdruck ausgewertet und undefiniert zurückgegeben wird, einschließlich des Hinzufügens javascript:void(0);der href.

Der void-Operator wird normalerweise nur verwendet, um einen undefinierten Grundwert zu erhalten, normalerweise unter Verwendung von "void (0)" (was "void 0" entspricht). In diesen Fällen kann stattdessen die globale Variable undefined verwendet werden (vorausgesetzt, sie wurde keinem nicht standardmäßigen Wert zugewiesen).

a {
  text-decoration: initial;
}

<a href="javascript:void(0);"> This link actually does nothing when clicked</a>

Die Antwort von @ Curt wird funktionieren, aber Sie können einen Cursor-Stil in CSS verwenden, damit er wie ein Link aussieht, ohne einen falschen Link zu generieren. Verwenden Sie je nach Browserkonformität Hand oder Zeiger.

Browserübergreifende konforme Zeiger-CSS (aus dem Cursor- Styleguide):

element {
    cursor: pointer;
    cursor: hand;
}

Eine Möglichkeit, die niemand erwähnt hat, besteht darin, die href auf einen leeren lokalen Dateispeicherort wie diesen zu verweisen

<a href='\\'>my dead link</a>

Warum? Wenn Sie ein Framework wie "Reagieren" oder "Winkel" verwenden, gibt der Compiler einige Warnungen aus, die Ihr Protokoll oder Ihre Konsole verschmutzen können. Diese Technik verhindert auch, dass Roboter oder Spinnen Dinge falsch verbinden.

NICHT VERWENDEN <a>... stattdessen verwenden <span class='style-like-link'> und dann die Klasse verwenden, um sie zu formatieren , wie Sie möchten.