jquery - rae - que es hacer doble clic
¿Cómo se hace que un enlace de anclaje no se pueda cliquear o deshabilitar? (18)
Tengo un enlace de anclaje que quiero deshabilitar una vez que el usuario hace clic en él. O bien, elimine la etiqueta delimitadora de todo el texto, pero definitivamente conserve el texto.
<a href='''' id=''ThisLink''>some text</a>
Puedo hacer esto fácilmente con un botón agregando .attr("disabled", "disabled");
Agregué la propiedad deshabilitada con éxito, pero aún se puede hacer clic en el enlace.
Realmente no me importa si el texto está subrayado o no.
¿Cualquier pista?
Cuando haces clic en el músico incorrecto, solo debe agregar "Incorrecto" y luego dejar de ser cliqueable.
Cuando haces clic y estás en lo correcto, debe agregar "Impresionante" y luego desactivar todas las etiquetas <a> .
Agrega una clase css :
.disable_a_href{
pointer-events: none;
}
Agrega este jquery :
$("#ThisLink").addClass("disable_a_href");
Bootstrap nos proporciona la clase .disabled . Por favor úsala
Pero la clase .disabled solo funciona cuando la etiqueta ''a'' ya tiene la clase ''btn''. No funciona con ninguna etiqueta ''a'' anterior. La clase ''btn'' puede no ser apropiada en algún contexto ya que tiene connotaciones de estilo. Bajo las carátulas, la clase .disabled establece pointer-events en none, por lo que puede hacer que css haga lo mismo que Saroj Aryal y Vitrilo han sugerido. (Gracias, Les Nightingill por este consejo).
Crear la siguiente clase en la hoja de estilos:
.ThisLink{
pointer-events: none;
cursor: default;
}
Agregue esta clase a su enlace dinámicamente de la siguiente manera.
<a href='''' id=''elemID''>some text</a>
// or using jquery
<script>
$(''#elemID'').addClass(''ThisLink'');
</script>
El método más limpio sería agregar una clase con eventos de puntero: ninguno cuando desee desactivar un clic. Funcionaría como una etiqueta normal.
.disableClick{
pointer-events: none;
}
Escribe esto una sola línea de código jQuery
$(''.hyperlink'').css(''pointer-events'',''none'');
si quieres escribir en el archivo css
.hyperlink{
pointer-events: none;
}
Este es el método que solía desactivar. Espero que ayude.
$("#ThisLink").attr("href","javascript:void(0)");
La forma más fácil
En tu html:
<a id="foo" disabled="true">xxxxx<a>
En tu js:
$(''#foo'').attr("disabled", false);
Si lo usa como atributo funciona a la perfección
La mejor manera es evitar la acción predeterminada. En el caso de la etiqueta de anclaje, el comportamiento predeterminado es redirigir a la dirección especificada href .
Entonces, seguir javascript funciona mejor en la situación:
$(''#ThisLink'').click(function(e)
{
e.preventDefault();
});
Los comentarios de Jason MacDonald funcionaron para mí, probados en Chrome, Mozila e IE.
Se agregó color gris para mostrar el efecto de desactivación.
.disable_a_href{
pointer-events: none;
**color:#c0c0c0 !important;**
}
Jquery estaba seleccionando solo el primer elemento en la lista de anclaje, agregó el carácter meta (*) para seleccionar y deshabilitar todo elemento con id #ThisLink .
$("#ThisLink*").addClass("disable_a_href");
Me acabo de dar cuenta de lo que estabas pidiendo (espero). Aquí hay una solución fea
var preventClick = false;
$(''#ThisLink'').click(function(e) {
$(this)
.css(''cursor'', ''default'')
.css(''text-decoration'', ''none'')
if (!preventClick) {
$(this).html($(this).html() + '' lalala'');
}
preventClick = true;
return false;
});
Prueba esto:
$(''a'').contents().unwrap();
Puede usar el evento onclick para deshabilitar la acción de hacer clic:
<a href='''' id=''ThisLink'' onclick=''return false''>some text</a>
O puede usar algo que no sea una etiqueta <a> .
Simplemente elimine el atributo href de la etiqueta de anclaje.
Simplemente en SASS:
.some_class{
// styles...
&.active {
pointer-events:none;
}
}
La respuesta seleccionada no es buena.
Usar estilo CSS de eventos de puntero . (como Jason MacDonald sugirió)
Ver MDN https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events . Es compatible con la mayoría de los navegadores.
El simple agregado de un atributo "deshabilitado" al ancla hará el trabajo si tienes una regla de CSS global como la siguiente:
a[disabled], a[disabled]:hover {
pointer-events: none;
color: #e1e1e1;
}
$(''#ThisLink'').one(''click'',function(){
$(this).bind(''click'',function(){
return false;
});
});
Esta sería otra forma de hacerlo, el controlador con return false , que deshabilitará el enlace, se agregará después de un clic.
$(''a'').removeAttr(''href'')
o
$(''a'').click(function(){ return false})
Depende de la situación
<a href=''javascript:void(0);''>some text</a>