نمونه اسکریپت برنامه قرعه کشی با جاوا اسکریپت (java script)

نحوه نوشتن و ساخت یک نمونه اسکریپت برنامه قرعه‌کشی با جاوا اسکریپت

در دنیای امروز، برنامه‌های قرعه‌کشی و سیستم‌های انتخاب تصادفی، نقش بسیار مهم و پررنگی در رویدادها، مسابقات، سازمان‌ها و حتی فروشگاه‌ها ایفا می‌کنند. این برنامه‌ها، به‌خصوص در فضای وب، باید سریع، دقیق و قابل‌اعتماد باشند. حالا، یکی از بهترین زبان‌های برنامه‌نویسی برای این کار، جاوا اسکریپت است؛ چون قابلیت اجرای مستقیم در مرورگرهای وب را دارد و به‌راحتی قابل ادغام با HTML و CSS است. در ادامه، قصد دارم، یک نمونه کامل و جامع از یک اسکریپت قرعه‌کشی با جاوا اسکریپت را بررسی کنیم، از ابتدا تا انتها، به‌گونه‌ای که بتوانید به‌راحتی در پروژه‌های خود از آن بهره ببرید.

۱. مقدمه‌ای بر ساختار برنامه قرعه‌کشی

در طراحی یک برنامه قرعه‌کشی، مهم است که ابتدا لیستی از افراد یا آیتم‌ها داشته باشید، سپس سیستم باید به‌صورت تصادفی یکی از آن‌ها را انتخاب کند. این کار، نیازمند استفاده از توابع تصادفی و مدیریت داده‌ها است. در این نمونه، از یک فرم HTML برای ورود لیست افراد یا شرکت‌کنندگان استفاده می‌کنیم و سپس، با کلیک بر روی یک دکمه، فرد برنده به‌صورت تصادفی انتخاب می‌شود.

۲. ساختار HTML برای ورودی و خروجی

ابتدا، باید ساختار صفحه وب خود را طراحی کنیم. این صفحه شامل یک textarea برای وارد کردن لیست افراد، یک دکمه برای شروع قرعه‌کشی، و یک بخش برای نمایش نتیجه است. نمونه کد HTML به شکل زیر است:

html  







برنامه قرعه‌کشی

لیست شرکت‌کنندگان، هر فرد را در یک خط وارد کنید:


قرعه‌کشی کن
نتیجه:

در این ساختار، کاربر می‌تواند لیست شرکت‌کنندگان را در textarea وارد کند، و با کلیک بر روی دکمه، نتیجه قرعه‌کشی را ببیند.

۳. نوشتن اسکریپت جاوا اسکریپت

حالا، به بخش مهم می‌رسیم: نوشتن کد جاوا اسکریپت. این کد باید وظایف زیر را انجام دهد:
- گرفتن لیست وارد شده توسط کاربر
- جدا کردن لیست بر اساس خطوط
- انتخاب تصادفی یکی از آیتم‌ها
- نمایش نتیجه در صفحه
کد جاوا اسکریپت به این صورت است:

javascript  
document.getElementById('drawBtn').addEventListener('click', function() {
const inputText = document.getElementById('participants').value;
const participants = inputText.split('\n').filter(item => item.trim() !== '');
if (participants.length === 0) {
alert('لطفاً لیست شرکت‌ک...  ← ادامه مطلب در magicfile.ir