Code button click vào đếm ngược lấy Pass giải nén

Khi bạn nhấn vào nút “Code” và đếm ngược, bạn sẽ nhận được mật khẩu để giải nén. Hãy chắc chắn rằng bạn đã đếm đúng số lần và nhập đúng mật khẩu để tiếp tục quá trình giải nén. Hướng dẫn code đếm ngược lấy pass giải nén – Thấy nhiều anh em thường xuyên search từ khóa này, nhưng trên mạng lại không hiển thị đúng kết quả mong muốn. Trong bài viết này toantuoity.com xin chia sẽ mẫu code đếm ngược thời gian hiển thị pass như dưới đây.

Bước 1: Chuẩn bị nội dung html

<div class="matkhaugiainen">
    <input id="laypass" class="laymk" type="button" value="Lấy Pass giải nén"><br>
    <span id="hienpass" class="doimk hienmk">Đợi xem Pass</span>
</div>

Bước 2: Chuẩn bị đoạn JavaScript

<script>
        jQuery(document).ready(function ($) {    
             function toancr(min, max){
                return Math.floor(Math.random() * (max - min)) + min;
            }
            var timeout = null;
              var s = toancr (65, 85); //55, 75
            
            function demnguoc(){
                $("#laypass").addClass("nhanvao"); 
                $("#hienpass").addClass("hienmatkhau");            
                $("#hienpass").html(s);            
                if (s == -1){
                    clearTimeout(timeout);
                    $("#hienpass").html("Pass giải nén: toancr.com");
                    return false;
                }
                timeout = setTimeout(function(){
                    s--;
                    demnguoc();
                }, 1000); 
            }
            $(document).on("click", "#laypass", function(){

                demnguoc();
            });
        });
        </script>

Bước 3: Thêm 1 ít CSS cho đẹp mắt nhé

.laymk, .hienmk {
    background: red !important;
    color: white !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    padding: 5px 10px !important;
    border: none !important;
    border-radius: 5px !important;
}
          
.doimk {display: none;}
          
.hienmatkhau {display: inline-block !important;}
          
.matkhaugiainen .nhanvao {display: none !important;}

Code button đếm ngược lấy mã giải nén {Update code mới}

<div id="dem-nguoc"><button>NHẬN MÃ KHUYẾN MÃI</button></div>
<script>
    var downloadButton = document.getElementById("dem-nguoc");
    var counter = 5;
        downloadButton.onclick = function(){
          setInterval(function() {
          counter--;

          if (counter < 0) {
              downloadButton.innerText = "0794794880"

              } else {
              downloadButton.innerText = "Đang tải... (" + counter.toString() + ")";
          }
      }, 1000);
    }
</script>

Giải thích & cách dùng: Copy đoạn code trên vào vị trí mà bạn muốn user click

• Thay đổi chữ nhận mã khuyến mãi thành nội dung mà bạn muốn. Ví dụ: Lấy mã, lấy pass, nhận code,…
• Var counter = 5 là số giây đếm ngược, ví dụ mình đang để 5 nghĩa là 5s đếm ngược
• 0794794880 là mã code hiển thị cho người dùng copy

Code button nhấn vào đếm ngược thời gian xong hiện ra pass

Đây là mẫu Code javascript đếm ngược lấy Pass giải nén có nút button copy tiện lợi cho người dùng. Mẫu này tương thích nhiều mã nguồn cho anh em tha hồ sử dụng luôn nhé!

<div class="laymaso" style="text-align: center;">
    <button id="layma" onclick="maxacnhan()" style=" background: red; color: white; border-radius: 30px; ">Lấy mã xác nhận</button>
    <div id="masola" onclick="copyText()"></div>
    <script>
        function maxacnhan() {
            let time = 6 // tính bằng giây;
            var countdown = setInterval(function() {
                time--;
                document.getElementById("layma").innerHTML = time;
                if (time == 0) {
                    document.getElementById("masola").innerHTML = "<button style='background: red; color: white; border-radius: 30px; margin-top: 20px;'>Copy mã: 8686</button><style>#layma{display:none;}#masola{color: red; font-size: 30px; font-weight: bold;}</style>"; // pass
                    clearInterval(countdown);
                }
            }, 1000);
        }
    </script>

      
    <script>
        function copyText() {
            /* Copy text into clipboard */
            navigator.clipboard.writeText
                ("8686");
        }
    </script>
</div>

Giải thích & cách dùng: Copy đoạn code trên vào vị trí mà bạn muốn user click

• Thay đổi chữ Lấy mã xác nhận thành nội dung khác theo nhu cầu của bạn nhé.
• let time = 6 => 6 ở đây được tính bằng giây đếm ngược. Bạn có thể thay đổi số giây theo mong muốn.
• Copy mã: 8686 => 8686 là mã xác nhận hiển thị cho user. Tuy nhiên ở đoạn code trên mình có thêm 1 đoạn javascript bấm vào copy luôn nên anh em cần thay đổi 2 vị trí => 8686 nhé!

Hy vọng những thông tin này sẽ có ích cho bạn. Chúc các bạn thành công!