+ متقاضیان شرکت در دوره کارآموزی فرانتاند باید سوالهای فرانتاند و سوالهای پیادهسازی را با Javascript پاسخ دهند. (نیازی نیست سوالهای جاوا را پاسخ دهند.)
+ متقاضیان شرکت در دوره کارآموزی بکاند باید سوالهای جاوا و سوالهای پیادهسازی را با هر زبانی که مایلند پاسخ دهند. (نیازی نیست سوالهای فرانتاند را پاسخ دهند.)
لینکهای مفید برای شرکت در مسابقه:
+ [نحوه کار با ورودی و خروجی](https://quera.ir/course/assignments/2693/problems/8774)
+ [قوانین شرکت در مسابقات](https://quera.ir/course/assignments/2693/problems/33523)
+ [دسترسیهای برنامه](https://quera.ir/course/assignments/2693/problems/33524)
+ [اطلاعات بیشتر در مورد این مسابقه](https://quera.ir/blog)
+ [قالب صورت سوال Front-End](https://quera.ir/course/assignments/5546/problems)
+ [آشنایی با امکان جدید Quera: تست نمونه سوالهای تکنولوژی](https://quera.ir/course/assignments/2693/problems/42815)
پیشنهاد میکنیم حتما بخش نحوه کار با ورودی و خروجی مخصوصا برای زبان JavaScript را مطالعه کنید.
در زمان مسابقه میتوانید سوالهای خود را از قسمت "سوال بپرسید" مطرح کنید. در ساعات ۱۰ الی ۱۳ و ۱۵ الی ۱۸ به سوالهای شما پاسخ داده میشود.
به منظور کمشدن رقابت و کدنویسی سریع هنگام مسابقه، جدول امتیازات بسته شده است.
- متقاضیان شرکت در دوره کارآموزی فرانتاند باید سوالهای فرانتاند و سوالهای پیادهسازی را با Javascript پاسخ دهند. (نیازی نیست سوالهای جاوا را پاسخ دهند.)
- متقاضیان شرکت در دوره کارآموزی بکاند باید سوالهای جاوا و سوالهای پیادهسازی را با هر زبانی که مایلند پاسخ دهند. (نیازی نیست سوالهای فرانتاند را پاسخ دهند.)
لینکهای مفید برای شرکت در مسابقه:
پیشنهاد میکنیم حتما بخش نحوه کار با ورودی و خروجی مخصوصا برای زبان JavaScript را مطالعه کنید.
در زمان مسابقه میتوانید سوالهای خود را از قسمت "سوال بپرسید" مطرح کنید. در ساعات ۱۰ الی ۱۳ و ۱۵ الی ۱۸ به سوالهای شما پاسخ داده میشود.
به منظور کمشدن رقابت و کدنویسی سریع هنگام مسابقه، جدول امتیازات بسته شده است.
**مهارتهای لازم:**
+ آشنایی با `JS`
***
میخواهیم با استفاده از جاوااسکریپت بر اساس یک لیستی از برخی استان های ایران ، یک`Autocomplete` مطابق با شکل زیر پیاده سازی کنیم.

# پروژه اولیه
پروژه اولیه را از [اینجا](https://quera.ir/qbox/download/kawdB8rKuQ/autocomplete.zip) دانلود کنید. ساختار فایلهای این پروژه به صورت زیر است.
```
autocomplete
├── app.js
├── index.html
└── styles.css
```
# جزئیات
با شروع به تایپ کردن در `input` یک لیستی از پیشنهادات برای کاربر ظاهر می شود با کلیک کردن بر روی هر کدام از آنها ،`input` مقدار دهی می شود.تغییرات لازم را در فایل `app.js` اعمال کنید.
# نکات
+ توجه داشته باشید هر پیشنهاد باید در یک عنصر `div` با کلاس `item` ساخته شوند.
+ در صورت یافت نشدن یک پیشنهاد می بایست `Not Found!` در یک عنصر با کلاس `not-found` ساخته شود.
+ به محض کلیک شدن بر روی یک پیشنهاد مقدار داخل `input` به آن تغییر می کند.
+ در صورت کلیک شدن بر روی `body` باید لیست ظاهر شده از بین برود.
+ توجه کنید که داوری خودکار بر مبنای نام کلاس های عناصر انجام میشود.
+ پروژه را با ساختار زیر ارسال کنید.
```
[your-zip-file-name].zip
└── app.js
```
فرانتاند - Autocomplete
مهارتهای لازم:
میخواهیم با استفاده از جاوااسکریپت بر اساس یک لیستی از برخی استان های ایران ، یکAutocomplete
مطابق با شکل زیر پیاده سازی کنیم.

پروژه اولیه🔗
پروژه اولیه را از اینجا دانلود کنید. ساختار فایلهای این پروژه به صورت زیر است.
جزئیات🔗
با شروع به تایپ کردن در input
یک لیستی از پیشنهادات برای کاربر ظاهر می شود با کلیک کردن بر روی هر کدام از آنها ،input
مقدار دهی می شود.تغییرات لازم را در فایل app.js
اعمال کنید.
نکات🔗
- توجه داشته باشید هر پیشنهاد باید در یک عنصر
div
با کلاس item
ساخته شوند.
- در صورت یافت نشدن یک پیشنهاد می بایست
Not Found!
در یک عنصر با کلاس not-found
ساخته شود.
- به محض کلیک شدن بر روی یک پیشنهاد مقدار داخل
input
به آن تغییر می کند.
- در صورت کلیک شدن بر روی
body
باید لیست ظاهر شده از بین برود.
- توجه کنید که داوری خودکار بر مبنای نام کلاس های عناصر انجام میشود.
- پروژه را با ساختار زیر ارسال کنید.
ارسال پاسخ برای این سؤال
در حال حاضر شما دسترسی ندارید.