لیستهای کشویی (Select)

برای ساختن لیستهای کشویی که به کاربران اجازه می دهد یک یا چند گزینه موجود در لیستی را در یک فرم انتخاب کند باید از تگ<select> استفاده کنیم. گزینه های موجود در این تگ بین <option> و <option/> قرار می گردند و پس از گزینه ها تگ پایانی لیست به صورت <select/> نوشته می شود.

در اینجا می توانید یک نمونه از کدی را که با آن یک لیست کشویی ساخته می شود مشاهده کنید:

در این قسمت می توانید لیست مربوط به کد بالا را ملاحظه کنید:

کادر کلمه عبور (Password)

احتمالاً تا به حال به سایتی برخورد کرده اید که برای ورود به آن نیاز به کلمه عبور داشته باشید. شما مسلماً تمایل ندارید وقتی کلمه عبور خود را وارد می کنید کلمه عبور شما نمایش داده شود و دیگران قادر به مشاهده آن باشند. به همین دلیل معمولاً سایتها برای اینکه کلمه عبور کاربران در هنگام پر کردن فرم نمایش داده نشود از نوعی کادر ورودی استفاده می کنند که کاملاً شبیه کادری است که برای وارد کردن متن استفاده می شود (Text Box) با این تفاوت که به جای نمایش کاراکترهای کلمه عبور به جای هر کاراکتر از یک نقطه یا ستاره (بستگی به مرورگر دارد) نمایش می دهد.

برای ساختن کادر کلمه عبور می توانید از کد زیر استفاده کنید:

کادر به دست آمده مانند زیر است. می توانید متنی را در آن بنویسید و نتیجه را مشاهده کنید:

کادر کلمه عبور (Password)

احتمالاً تا به حال به سایتی برخورد کرده اید که برای ورود به آن نیاز به کلمه عبور داشته باشید. شما مسلماً تمایل ندارید وقتی کلمه عبور خود را وارد می کنید کلمه عبور شما نمایش داده شود و دیگران قادر به مشاهده آن باشند. به همین دلیل معمولاً سایتها برای اینکه کلمه عبور کاربران در هنگام پر کردن فرم نمایش داده نشود از نوعی کادر ورودی استفاده می کنند که کاملاً شبیه کادری است که برای وارد کردن متن استفاده می شود (Text Box) با این تفاوت که به جای نمایش کاراکترهای کلمه عبور به جای هر کاراکتر از یک نقطه یا ستاره (بستگی به مرورگر دارد) نمایش می دهد.

برای ساختن کادر کلمه عبور می توانید از کد زیر استفاده کنید:

کادر به دست آمده مانند زیر است. می توانید متنی را در آن بنویسید و نتیجه را مشاهده کنید:

دکمه های رادیو (Radio Button)

برای ساختن دکمه های رادیو هم باید از تگ <input> استفاده کنیم. برای این کار باید از radio به عنوان مقدار شناسه typeاستفاده کنیم. در اینجا یک نمونه از کدی که برای ساختن دکمه رادیو آورده شده است:

در اینجا می توانید دکمه رادیو ایجاد شده را مشاهده کنید:

حتماً تا به حال دکمه های رادیویی را که در یک زمان فقط یکی از آنها می تواند انتخاب شده باشد مشاهده کرده اید. برای ساختن این نوع دکمه ها از کد بالا استفاده می شود همه دکمه هایی که باید به این گونه رفتار کنند دارای یک نام هستند اما مقادیر قرار گرفته شده در شناسه value در آنها متفاوت است. در زیر می توانید کد مربوط به یک دسته دکمه رادیو را ببینید:

چک باکس (checkbox)

برای ساختن چک باکس هم باید از تگ <input> استفاده کنیم. برای این کار باید از checkbox به عنوان مقدار شناسه typeاستفاده کنیم. در اینجا یک نمونه از کدی که برای ساختن چک باکس آورده شده است:

در اینجا می توانید چک باکس ایجاد شده را مشاهده کنید:

در اینجا به توضیح برخی از شناسه هایی که برای چک باکس به کار می روند می پردازیم. به خاطر داشته باشید که همه این شناسه ها باید در تگ <input> به کار روند.

ما با استفاده از تگ  می توانیم بسیاری از اطلاعاتی را که در فرمها نیاز داریم از طریق کاربران به دست آوریم. در حقیقت این تگ برای وارد کردن اطلاعات توسط کاربر استفاده می شود. این تگ در HTML4.01 نیازی به تگ پایانی ندارد.

از تگ می توانیم برای ساختن کادرهای مربوط به وارد کردن متن، کادر کلمه عبور، فیلدهای مخفی، دکمه های رادیو، چک باکس، دکمه ارسال فرم، دکمه پاک کردن فرم و انواع دیگر دکمه ها و چند نوع ورودی دیگر استفاده کنیم. در اینجا هر کدام از این ورودی ها را به صورت جداگانه مورد بررسی قرار می دهیم.

جعبه ورودی متن (Text Box)

از این نوع ورودی برای ایجاد یک کادر یک سطری برای ورود متن استفاده می شود. برای ساختن این کادر باید از شناسه "type="text در تگ استفاده کنیم. در صورت تعریف نشدن شناسه type در مرورگرهای جدید این شناسه به صورت پیش فرض به کار می رود و یک Text Box را نمایش می دهد اما برخی از مرورگرهای قدیمی در صورتی که از ایسن شناسه استفاده نشود این کادر را نمایش نمی دهند.

یک نمونه از کد مربوط به ایجاد این کادر را می توانید در اینجا مشاهده کنید: