html - etiqueta - inhabilitar link css

¿Cómo puedo deshabilitar HREF si se ejecuta onclick?

Question

Tengo un ancla con los HREF y ONCLICK establecidos. Si se hace clic y Javascript está habilitado, quiero que solo ejecute ONCLICK e ignore HREF . Del mismo modo, si Javascript está deshabilitado o no es compatible, quiero que siga la URL HREF e ignore ONCLICK . A continuación se muestra un ejemplo de lo que estoy haciendo, que ejecutaría el JS y seguiría el enlace al mismo tiempo (normalmente se ejecuta el JS y luego cambia la página):

<A HREF="http://example.com/no-js-login" ONCLICK="yes_js_login()">Log in</A>

¿Cuál es la mejor manera de hacer esto?

Espero una respuesta de Javascript, pero aceptaré cualquier método mientras funcione, especialmente si esto se puede hacer con PHP. He leído " un enlace href se ejecuta y redirige la página antes de que la función onclick de javascript pueda finalizar " ya, pero solo retrasa HREF , pero no lo desactiva por completo. También estoy buscando algo mucho más simple.

Answer 1

En mi caso, tuve una condición cuando el usuario hizo clic en el elemento "a". La condición era:

Si otra sección tenía más de diez elementos, el usuario no debería ser redirigido a otra página.

Si otra sección tenía menos de diez elementos, el usuario debería ser redirigido a otra página.

La funcionalidad de los elementos "a" depende del otro componente. El código dentro del evento click es el siguiente:

var elementsOtherSection = document.querySelectorAll("#vehicle-item").length;
if (elementsOtherSection> 10){
     return true;
}else{
     event.preventDefault();
     return false;
}

Answer 2

Es más sencillo si pasa un parámetro de evento como este:

<a href="#" onclick="yes_js_login(event);">link</a>

function yes_js_login(e) {
    e.stopImmediatePropagation();
}

Answer 3

Esto funcionó para mí:

<a href="" onclick="return false;">Action</a>

Answer 4

Esto podría ayudar. No se necesita JQuery

<a href="../some-relative-link/file" 
onclick="this.href = ''https://docs.google.com/viewer?url=''+this.href; this.onclick = '''';" 
target="_blank">

Este código hace lo siguiente: Pase el enlace relativo a Google Docs Viewer

1. Obtenga la versión completa del enlace del ancla por this.href
2. Abre el enlace de la nueva ventana.

Así que en tu caso esto podría funcionar:

<a href="../some-relative-link/file" 
onclick="this.href = ''javascript:''+console.log(''something has stopped the link''); " 
target="_blank">

Answer 5

Puede usar la primera solución sin editar, si coloca el retorno primero en el atributo onclick :

<a href="https://example.com/no-js-login" onclick="return yes_js_login();">Log in</a>

yes_js_login = function() {
     // Your code here
     return false;
}

Ejemplo: https://jsfiddle.net/FXkgV/289/

Answer 6

Puedes usar este simple código:

<a href="" onclick="return false;">add new action</a><br>

Answer 7

Resolví una situación en la que necesitaba una plantilla para el elemento que manejaría alternativamente una URL normal o una llamada javascript, donde la función js necesita una referencia al elemento llamante. En javascript, "esto" funciona como una referencia automática solo en el contexto de un elemento de formulario, por ejemplo, un botón. No quería un botón, solo la apariencia de un enlace regular.

Ejemplos:

<a onclick="http://blahblah" href="http://blahblah" target="_blank">A regular link</a>
<a onclick="javascript:myFunc($(this));return false" href="javascript:myFunc($(this));"  target="_blank">javascript with self reference</a>

Los atributos href y onClick tienen los mismos valores, excepto que agregué "return false" en onClick cuando se trata de una llamada de javascript. Tener "devolver falso" en la función llamada no funcionó.

Answer 8

Simplemente deshabilite el comportamiento predeterminado del navegador usando preventDefault y pase el event dentro de su HTML.

<a href=/foo onclick= yes_js_login(event)>Lorem ipsum</a>

yes_js_login = function(e) {
  e.preventDefault();
}

Answer 9

usar de la siguiente manera

 onClick="javascript:void(0);anyfunction();"

Answer 10

    yes_js_login = function() {
         // Your code here
         return false;
    }

Si devuelve falso, debería evitar la acción predeterminada (ir a href).

Edición: Lo sentimos, no parece funcionar, puedes hacer lo siguiente:

<a href="http://example.com/no-js-login" onclick="yes_js_login(); return false;">Link</a>

Answer 11

<a href="http://www.google.com" class="ignore-click">Test</a>

con jQuery:

<script>
    $(".ignore-click").click(function(){
        return false;
    })
</script>

con JavaScript

<script>
        for (var i = 0; i < document.getElementsByClassName("ignore-click").length; i++) {
            document.getElementsByClassName("ignore-click")[i].addEventListener(''click'', function (event) {
                event.preventDefault();
                return false;
            });
        }
</script>

Usted asigna la clase .ignore-click a tantos elementos que desee y los clics en esos elementos serán ignorados