Cómo deshabilitar el doble clic usando jquery

programación


Quiero desactivar el doble clic y permitir solo un clic. Probé el siguiente código, pero no funcionó. ¿Qué pasa aquí? Estoy trabajando en la sintaxis mvc Razor.
Lo que quiero es que cuando el usuario haga clic en guardar carta guarda la carta, pero si el usuario hace doble clic en ella, no debería activar nada.

Lo que he probado:

HTML
<a id="SaveLetterBtn" class="button-create-letters bg-dark2 white SaveLetterBtn" href="@Url.Action("SaveLetter", "Letters")">Save Letter</a>
javascript
$("#SaveLetterBtn").on("click", function(event) {
      event.preventDefault();

      $(this).attr("disabled", true);
    });

Código 2

javascript
$("#SaveLetterBtn").on('dblclick', function (e) {
               e.preventDefault();
           });

Solución 2

Puedes simplemente manejar el evento dblclick y no hacer nada con él.

HTML
<html>
<body>
    <button type="button" id="testBtn">Test!</button>

    <script type="text/javascript">
        const btn = document.querySelector("#testBtn");

        btn.addEventListener("dblclick", (e) => {
            e.preventDefault();
        });
    </script>
</body>
</html>

Solución 1

Para evitar una acción de doble clic, debe desactivar el botón en el primer clic y luego volver a activarlo después de un cierto retraso. A continuación se muestra un ejemplo de cómo puede modificar su código para lograr esta funcionalidad:

HTML
<a id="SaveLetterBtn" class="button-create-letters bg-dark2 white SaveLetterBtn" href="@Url.Action("SaveLetter", "Letters")">Save Letter</a>

javascript
<script>
  $(document).ready(function() {
    var clicked = false;
    $("#SaveLetterBtn").on("click", function(event) {
      if (clicked) {
        event.preventDefault();
        return;
      }
      clicked = true;
      var $this = $(this);
      $this.addClass('disabled');
      setTimeout(function() {
        clicked = false;
        $this.removeClass('disabled');
      }, 1000); // Set your desired delay in milliseconds here
    });
  });
</script>

En este código modificado, el botón se desactiva con el primer clic y se vuelve a activar después de un retraso de 1000 milisegundos (1 segundo). Ajuste el retraso según sus requisitos. Este retraso evitará que se pueda hacer clic en el botón durante ese período de tiempo.

Solución 3

¡Prueba!

var hecho clic = falso;

$(“#testBtn”).on(‘hacer clic’, función(e) {
si (se hizo clic == verdadero) {
console.log(“¡Clic bloqueado!”);
hecho clic = falso;
}
demás {
console.log(“¡Se permite hacer clic!”);
e.preventDefault();
hecho clic = verdadero;
}
});

$(“#testBtn”).on(‘dblclick’, función(e) {
console.log(“DblClick!”);
});

コメント

タイトルとURLをコピーしました