✅ آموزش ساخت کپچا ساده با استفاده از جاوااسکریپت 👇👇
💢 توضیحات:
1⃣ این کد یک کپچا عددی تصادفی ایجاد می‌کند.
2⃣ کاربر باید عدد تولید شده را در فیلد ورودی وارد کند.
3⃣ وقتی کاربر روی دکمه "تأیید" کلیک می‌کند، کپچا بررسی می‌شود و نتیجه نمایش داده می‌شود.
4⃣ اگر کاربر پاسخ نادرستی وارد کند، کپچا به‌طور تصادفی دوباره تولید می‌شود.
#css #html #js
🌈 Web_Designer98.t.me
<!-- https://yangx.top/Web_Designer98 -->
<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@Web_Designer98</title>
<style>
/* https://yangx.top/Web_Designer98 */
body {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 50px;
}
#captcha {
font-size: 24px;
margin: 10px;
}
/* https://yangx.top/Web_Designer98 */
</style>
</head>
<body>
<!-- https://yangx.top/Web_Designer98 -->
<h2>تأیید کپچا @Web_Designer98</h2>
<div id="captcha"></div>
<input type="text" id="captchaInput" placeholder="کد را وارد کنید">
<button onclick="validateCaptcha()">تأیید</button>
<p id="result"></p>
<!-- https://yangx.top/Web_Designer98 -->
<script>
//https://yangx.top/Web_Designer98
function generateCaptcha() {
const captchaLength = 5;
let captcha = '';
for (let i = 0; i < captchaLength; i++) {
captcha += Math.floor(Math.random() * 10); // تولید اعداد ۰ تا ۹
}
//https://yangx.top/Web_Designer98
document.getElementById('captcha').textContent = captcha;
return captcha;
}
let generatedCaptcha = generateCaptcha();
function validateCaptcha() {
const userInput = document.getElementById('captchaInput').value;
const result = document.getElementById('result');
if (userInput === generatedCaptcha) {
result.textContent = 'کپچا موفقیت آمیز بود! ✅';
} else {
result.textContent = 'کپچا ناموفق بود. لطفاً دوباره امتحان کنید. ❌';
generatedCaptcha = generateCaptcha(); // تولید دوباره کپچا
document.getElementById('captchaInput').value = ''; // پاک کردن فیلد ورودی
}
}
</script>
<!-- https://yangx.top/Web_Designer98 -->
</body>
</html>
💢 توضیحات:
1⃣ این کد یک کپچا عددی تصادفی ایجاد می‌کند.
2⃣ کاربر باید عدد تولید شده را در فیلد ورودی وارد کند.
3⃣ وقتی کاربر روی دکمه "تأیید" کلیک می‌کند، کپچا بررسی می‌شود و نتیجه نمایش داده می‌شود.
4⃣ اگر کاربر پاسخ نادرستی وارد کند، کپچا به‌طور تصادفی دوباره تولید می‌شود.
#css #html #js
🌈 Web_Designer98.t.me
👍5