Tengo un enlace en mi HTML:

<a href="/DoSomethingDangerous">do something dangerous</a>

Visitar el DoSomethingDangerous enlace causas de una no fácilmente reversable acción.

Así que después de que el vínculo se hace clic me gustaría un cuadro de diálogo (por ejemplo, «¿estás seguro?» «OK», «Cancelar») para que se muestre y si el usuario hace clic en Cancelar el enlace no visitado y el navegador se queda en la misma página.

¿Cuál es el más limpio de la técnica el uso de Javascript o jQuery para implementar esto?

  • Es seguro asumir que todos los que usan este tiene javascript habilitado? Cualquier usuario con discapacidad sería capaz de visitar el «peligroso» de la página sin avisos
  • Usted debería estar haciendo cosas peligrosas a través de las peticiones post solamente. Ninguna cantidad de JavaScript va a evitar que alguien accidentalmente visitar este enlace si que tiene JavaScript deshabilitado, y no tendrá ningún impacto en un motor de búsqueda de rastreo de su sitio.
  • Usted puede ser que desee cambiar las cosas..solo visitar un enlace no debe causar acciones irreversibles. Si esa página hace potencialmente cosas malas, que tal vez debería tener una confirmación con un formulario en el que se vuelve a sí mismo para realizar la acción real. Si usted quiere tener un cuadro de diálogo que se ejecuta en la página de confirmación, usted podría tener que generar ese formulario y enviarlo (o enviar a través de ajax), y la no-JS usuarios aún ver la forma estática de diálogo.
  • Requiere la página de inicio de sesión, entonces no puede ser spidered, la acción es reversible, de forma que mientras el 90%+ de las personas a obtener la confirmación de diálogo estoy feliz.
  • posibles duplicados de Javascript cuadro de diálogo de confirmación en el href del enlace?

5 Comentarios

  1. 68
    <a class="confirm" href="/DoSomethingDangerous">do something dangerous</a>

    JQuery:

    $(function() {
        $('.confirm').click(function(e) {
            e.preventDefault();
            if (window.confirm("Are you sure?")) {
                location.href = this.href;
            }
        });
    });

    o aún más sencillo:

    $(function() {
        $('.confirm').click(function() {
            return window.confirm("Are you sure?");
        });
    });

    El nativo de confirmar el cuadro puede no ser el estilo.
    Si desea que el estilo, entonces usted podría utilizar jQuery.UI.dialog

    • bonito reutilizables solución!
    • Me gustaría usar este, pero la mía, solo parpadea y se establece directamente para Sí o verdadero. Este occours en Firefox, así como en el Borde.
  2. 31

    Si sabemos que la función DOM window.confirm() devuelve booleano true en «sí» y false en «no», nuestro vínculo podría ser simplificado un poco:

    <a href="/DoSomething" onclick="return confirm('Are you sure?');">Link</a>
    • Error de sintaxis: Inesperado ) – tiene un soporte para muchos al final, debe ser: return confirm('Are you sure?');
  3. 19

    Creo que la solución más sencilla será

    <a href="/DoSomethingDangerous" onclick="if (!confirm('Are you sure?')) return false;">Link test</a>

    • Esto funcionó para mí la otra opción siempre devuelve true.

Dejar respuesta

Please enter your comment!
Please enter your name here