¿Cómo hago que un enlace no se pueda hacer clic?

Question

¿Hay alguna propiedad de CSS o algo que pueda usar con mi etiqueta de anclaje para que no se pueda hacer clic o TENGO que hacer cosas en el código para obtener lo que quiero?

[editar] onclick=return false; es refrescante la página .. no quiero que desee .. esta etiqueta de anclaje para aparecer como texto plano .. De hecho, he CSS aplicado sobre el cambio etiqueta de anclaje .. así que no puedo a lable sencilla o lo que sea

Answer 1

Si desea que la etiqueta de anclaje sea un destino de enlace, pero no una fuente de enlace, omita el atributo href y solo tenga un atributo de nombre. La especificación de HTML 4.01 permite esto y sugiere que los navegadores muestren el texto dentro de la etiqueta de anclaje href-less como texto normal.

Answer 2

Usted puede utilizar

disabled="disabled" 

en la etiqueta de anclaje, creo - que es lo que hago en csharpindepth.com, de todos modos. No me gustaría jurar qué tan ampliamente apoyado es, sin duda, es probable que quieras comprobarlo. Parece que está bien en Chrome, IE y Firefox. No sé si hay un equivalente solo en CSS.

Tenga en cuenta que creo que esto hará que el enlace visiblemente no se pueda hacer clic (sin embargo, el navegador quiere hacer eso) en lugar de simplemente no hacer nada.

EDIT: Acabo de probar esto en un archivo local, y no funciona ... mientras que definitivamente funciona en csharpindepth.com. Vale la pena intentarlo, pero también vale la pena mirar otros enfoques :)

EDITAR: Como señala BoltClock, este no es HTML estrictamente válido, lo que puede significar que solo funcionará en el modo peculiar, por ejemplo. (Eso podría explicar mi falla al producirlo localmente)

Probablemente esté mejor con una solución de JavaScript junto con un estilo CSS para cambiar la apariencia del enlace ... pero dejaré esta respuesta aquí solo para el grabar.

Answer 3

<a href="abcd.html" onclick="return false;">abcd</a> 

Answer 4

incluyendo un atributo onclick="return false" en el elemento de anclaje hace el truco. Si bien esta solución usa javascript y no css

Answer 5

Aquí está la solución de HTML/CSS puro:

1. quitar la etiqueta "href", y poner su anclaje en el "nombre" attr (probablemente sabía que esto ya)

2. Añadir el siguiente estilo a su enlace:

   a{ text-decoration: none; cursor: default; } 
   

Debe apuntar a los estilos de anclaje mediante atributos con nombre, por lo que todos sus enlaces dont convertido en "permite hacer clic", así:

a[name=*]{ text-decoration: none; cursor: default; } 

attrs con nombre no trabajarán en IE 6 (probablemente no en 7 tampoco). Una solución de navegador completamente cruzada es agregar una clase a los anclajes, y apuntar a eso.Ej .:

a.anchor{ text-decoration: none; cursor: default; } 

Nota: El estilo anterior hace que los enlaces "aparezcan" no se pueden hacer clic. Si una de las etiquetas a tenía un href, aún podía hacer clic en ella y "ir a algún lado" o "hacer algo".

Espero que esto ayude.

Answer 6

Coloque un bloque style = "position: absolute" justo antes de la etiqueta de anclaje y mida el tamaño para superponer el contenido. No estoy seguro de por qué quiere hacerlo unclickable mayoría de la gente se está preguntando cómo hacer que los eslabones de una html en capas se puede hacer clic http://wsmithdesign.wordpress.com/2010/10/20/layering-html-with-absolute-positions-in-fluid-html/

Answer 7

Sólo una actualización que en los navegadores modernos que puede hacer:

a.disable { 
 
    pointer-events: none; 
 
    cursor: default; 
 
}

<a href="http://stackoverflow.com" class="disable">SO</a>

Answer 8

Si el elemento de anclaje es un elemento del lado del servidor, elimine el atributo href. anchor.attributes.remove ("href");

Answer 9

Si desea agregar anclaje a continuación, utilizar este código html
Usar este código html antes de donde se quiere poner el ancla
<a id="Write Your Anchor Here" class="invisible"></a>
es decir
<a id="anchor" class="invisible"></a> How to Put Anchor
o

<div id="youranchorname" class="anchor"> 

https://www.example.com/2016/11/how-to-add-html-code#anchor

utilizando esta URL llegado directamente al visitante a la parte de cómo poner el ancla en el puesto Gracias

Nota: Esta URL se usa sólo con fines de ejemplo. No es una dirección URL de trabajo y su etiqueta div debe estar cerrada con </div>

Answer 10

este bonito funciona para mí. Agregue una clase de desactivación a su etiqueta a. y este fragmento de código en su css

a.disable { 
pointer-events: none; 
cursor: default; 
}