Em thấy có cách này để làm tăng thứ hạng từ khóa, như trên hình thì người tải cần nhập mã mới download được. Bác có hướng dẫn này không ạ? Cho em xin với
Giới thiệu
- Hiển thị 1 mã code 6 ký tự ngẫu nhiên cả số và chữ sau khi đếm ngược về 0 theo thời gian cài đặt
- Nhập đoạn mã code để hiển thị nội dung ẩn
- Nội dung ẩn sử dụng HTML nằm trong JS, có thể kết hợp với các công cụ mã hóa JS để bảo mật nội dung hơn
Demo
HTML để hiển thị đếm ngược và khung nhập mã
<div id="countdown"></div>
<div id="hidden-content" style="display: none;">
<div id="hidden-text">Nhập code <span id="generated-code"></span> vào để download</div>
</div>
<div id="code-input">
<input type="text" id="user-code" maxlength="6" autocomplete="off" placeholder="Nhập mã ở đây...">
<button onclick="checkCode()">Download</button>
</div>
JS
document.getElementById('code-input').style.display = 'none';
let countdown = 30;
let countdownDisplay = document.getElementById('countdown');
let countdownInterval = setInterval(() => {
countdown--;
countdownDisplay.innerText = `Bạn có thể xem nội dung ẩn sau ${countdown} giây`;
if (countdown <= 0) {
clearInterval(countdownInterval);
document.getElementById('hidden-content').style.display = 'block';
document.getElementById('code-input').style.display = 'block';
generateRandomCode();
}
}, 1000);
function checkCode() {
let userCode = document.getElementById('user-code').value;
let generatedCode = document.getElementById('generated-code').innerText;
if (userCode === generatedCode) {
document.getElementById('hidden-text').innerHTML = "<a href='#chapitre-02' class='button'>Xem hướng dẫn</a>";
document.getElementById('hidden-content').style.display = 'block';
document.getElementById('code-input').style.display = 'none';
document.getElementById('countdown').style.display = 'none';
} else {
alert('Mã không đúng! Hãy thử lại.');
}
}
function generateRandomCode() {
let characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
let code = '';
for (let i = 0; i < 6; i++) {
code += characters.charAt(Math.floor(Math.random() * characters.length));
}
document.getElementById('generated-code').innerText = code;
}
Lưu ý: 30 là để cài đặt thời gian đếm ngược hiển thị mã và <a href='#chapitre-02' class='button'>Xem hướng dẫn</a> chính là nội dung ẩn, chấp nhận thẻ HTML và không sử dụng dấu đóng mở kép "
