jQuery deshabilita un enlace
¿Alguien sabe cómo deshabilitar un enlace en jquery SIN usarlo return false;?
Específicamente, lo que estoy tratando de hacer es deshabilitar el enlace de un elemento, hacer clic en él usando jquery, lo que activa algunas cosas, y luego volver a habilitar ese enlace para que, si se hace clic nuevamente, funcione de forma predeterminada.
Gracias. dave
ACTUALIZACIÓN
Aquí está el código. Lo que debe hacer después de que .expandedse haya aplicado la clase es volver a habilitar el enlace deshabilitado.
$('ul li').click(function(e) {
e.preventDefault();
$('ul').addClass('expanded');
$('ul.expanded').fadeIn(300);
//return false;
});
$('#myLink').click(function(e) {
e.preventDefault();
//do other stuff when a click happens
});
Eso evitará el comportamiento predeterminado de un hipervínculo, que es visitar el href especificado.
Del tutorial de jQuery :
Para los clics y la mayoría de los demás eventos, puede evitar el comportamiento predeterminado (aquí, siguiendo el enlace a jquery.com) llamando a event.preventDefault() en el controlador de eventos.
Si solo desea hacerlo preventDefault()si se cumple una determinada condición (algo está oculto, por ejemplo), puede probar la visibilidad de su ul con la clase expandida . Si está visible (es decir, no está oculto), el enlace debería activarse normalmente, ya que no se ingresará la declaración if y, por lo tanto, no se evitará el comportamiento predeterminado:
$('ul li').click(function(e) {
if($('ul.expanded').is(':hidden')) {
e.preventDefault();
$('ul').addClass('expanded');
$('ul.expanded').fadeIn(300);
}
});
Prueba esto:
$("a").removeAttr('href');
EDITAR-
De su código actualizado:
var location= $('#link1').attr("href");
$("#link1").removeAttr('href');
$('ul').addClass('expanded');
$('ul.expanded').fadeIn(300);
$("#link1").attr("href", location);
Para otros que llegaron aquí a través de Google como yo, aquí hay otro enfoque:
css:
.disabled {
color: grey; // ...whatever
}
jQuery:
$('#myLink').click(function (e) {
e.preventDefault();
if ($(this).hasClass('disabled'))
return false; // Do something else in here if required
else
window.location.href = $(this).attr('href');
});
// Elsewhere in your code
if (disabledCondition == true)
$('#myLink').addClass('disabled')
else
$('#myLink').removeClass('disabled')
Recuerde: no solo esta es una clase CSS
clase = "estilo de botón"
pero también estos dos
class="estilo de botón deshabilitado"
para que puedas agregar y eliminar fácilmente más clases con jQuery. No es necesario tocar href...
¡Me encanta jQuery! ;-)
Aquí hay una solución alternativa de CSS/jQuery que prefiero por su concisión y secuencias de comandos minimizadas:
CSS:
a.disabled {
opacity: 0.5;
pointer-events: none;
cursor: default;
}
jQuery:
$('.disableAfterClick').click(function (e) {
$(this).addClass('disabled');
});
Puede eliminar el clic para obtener el enlace siguiendo lo siguiente;
$('#link-id').unbind('click');
Puede volver a habilitar el enlace de la siguiente manera,
$('#link-id').bind('click');
No puede utilizar la propiedad 'deshabilitada' para los enlaces.
