Cara menonaktifkan klik dua kali menggunakan jquery

pemrograman


Saya ingin menonaktifkan klik dua kali dan hanya mengizinkan satu klik. Saya sudah mencoba kode berikut, tetapi tidak berhasil. Apa yang salah di sini. Saya sedang mengerjakan sintaks mvc Razor.
Yang saya inginkan adalah, ketika pengguna mengklik Simpan surat tombol, itu akan menyimpan surat itu, tetapi jika pengguna mengkliknya dua kali, itu tidak akan memicu apa pun.

Apa yang saya coba:

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);
    });

Kode 2

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

Solusi 2

Anda hanya bisa menangani acara dblclick dan tidak melakukan apa pun dengannya.

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>

Solusi 1

Untuk mencegah tindakan klik dua kali, Anda harus menonaktifkan tombol pada klik pertama dan kemudian mengaktifkannya kembali setelah penundaan tertentu. Berikut adalah contoh bagaimana Anda dapat memodifikasi kode Anda untuk mencapai fungsi ini:

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>

Dalam kode yang dimodifikasi ini, tombol dinonaktifkan pada klik pertama dan diaktifkan kembali setelah jeda 1000 milidetik (1 detik). Sesuaikan penundaan sesuai kebutuhan Anda. Penundaan ini akan mencegah tombol diklik selama jangka waktu tersebut.

Solusi 3

Tes!

var diklik = salah;

$(“#testBtn”).on(‘klik’, fungsi(e) {
if (diklik == benar) {
console.log(“Klik diblokir!”);
diklik = salah;
}
kalau tidak {
console.log(“Klik diperbolehkan!”);
e.preventDefault();
diklik = benar;
}
});

$(“#testBtn”).on(‘dblclick’, fungsi(e) {
console.log(“DblKlik!”);
});

コメント

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