این آموزش در تاریخ ۱۴۰۲/۰۶/۲۰ آپدیت شده است.
آموزش صفت Autocomplete در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش صفت Autocomplete در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
صفت Autocomplete در HTML
با استفاده از صفت autocomplete میتونیم قابلیت تکمیل کردن خودکار یک اینپوت ( Input ) رو مشخص نماییم، که ما به راحتی با استفاده از On یا Off میتوانیم این قابلیت را فعال یا غیرفعال نماییم.
روش کار این صفت بطور کلی به اینصورت می باشد که با تایپ اولین حرف توسط کاربر مرورگرها بصورت خودکار مواردی را به کاربر پیشنهاد میکنند ( مواردی که قبلا توسط کاربر درون فیلدها وارد شده است ) و کاربر میتواند یکی از این موارد را انتخاب نماید.
Free-Learn
عناصری که توسط این صفت پشتیبانی می شوند
این صفت را میتوان در عناصر/تگ های زیر بکار برد.
| <input> | <form> |
Free-Learn
مثال از صفت Autocomplete در HTML
در ادامه میتوانید یک مثال از این صفت را مشاهده نمایید.
مثال شماره ۱ : استفاده در تگ Form
|
1 2 3 4 5 6 7 8 9 |
<body> <p><b>روی اینپوت کلیک کن تا لیستی از موارد قبلا وارد شده رو ببینی</b></p> <form action="files/get_data.php" method="POST" autocomplete="on"> <input type="text" name="myname"> <input type="submit" value="ارسال"> </form> </body> |
مثال شماره ۲ : استفاده در تگ Input
|
1 2 3 4 5 6 7 8 |
<body> <form action="files/get_data.php" method="POST"> <input type="text" name="myname" autocomplete="off"> <input type="submit" value="ارسال"> </form> </body> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از صفت autocomplete در HTML پشتیبانی میکنند یا خیر.
| نام تگ | Chrome | Firefox | Opera | Safari | Edge |
| form | بله | بله | بله | بله | بله |
| input | بله | بله | بله | بله | بله |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این صفت در HTML بصورت زیر می باشد.
|
1 2 |
<form autocomplete="on|off"> <input autocomplete="on|off"> |
Free-Learn
جدول مقادیر صفت Autocomplete در HTML
در جدول زیر میتوانید، مقادیری را که میتوان در این صفت استفاده کرد مشاهده نمایید.
| مقدار | توضیح |
|---|---|
| on | قابلیت تکمیل خودکار را فعال / روشن میکند |
| off | قابلیت تکمیل خودکار را غیرفعال / خاموش میکند |
Free-Learn
نکات و توضیحات
- سعی کنید این قابلیت رو بروی فرم یا اینپوت هایی که شامل داده های حساس هستن غیرفعال یا خاموش کنید.
