کنترل های ذاتی HTML

کنترل < select > :

از کنترل select برای ايجاد يک ليست باز شو استفاده می شود . اين ليست می تواند دارای گزينه های مختلفی باشد که هر کدام توسط يک تگ < option > تعيين می شود :

خواص مهم تگ select
نام خاصيت نوع خاصيت شرح
disabled disabled در صورتی که مقدار اين خاصيت برابر disabled تنظيم شود ، ليست غير فعال خواهد بود .
multiple multiple در صورتی که مقدار اين خاصيت برابر multiple تنظيم شود ، می توان در هر لحظه بيش از يک مورد را از ليست انتخاب کرد . در حالت پيش فرض ، در هر لحظه حداکثر می توان يک مورد را از ليست انتخاب کرد .
name نام تعيين کننده يک نام منحصر به فرد برای ليست باز شو است .
size عدد
number
توسط اين خاصيت می توان تعداد آيتم های قابل مشاهده در ليست را در حال عادی ( بسته بودن ليست ) تعيين کرد . به طور پيش فرض فقط يک آيتم از ليست قابل مشاهده است .

* تگ < option > :

از اين تگ برای تعيين يک مورد در داخل يک ليست استفاده می شود . متنی که بين تگ باز و بسته < option > قرار بگيرد ، تعيين کننده نام گزينه در ليست است .
تکته : اين تگ بايستی در درون تگ < select > به کار رود در غير اين صورت معنا و کاربردی ندارد .

خواص مهم تگ option
نام خاصيت نوع خاصيت شرح
disabled disabled در صورتی که مقدار اين خاصيت برابر disabled تنظيم شود ، آن گزينه ليست غير فعال خواهد بود .
selected selected در صورتی که مقدار اين خاصيت برای گزينه ای در ليست برابر selected تنظيم شود ، آن گزينه به صورت پيش فرض در ليست انتخاب شده است و اول نمايش داده می شود . در هر ليستي در هر لحظه حداکثر يک گزينه می تواند selected باشد .
value مقدار مقدار و ارزش گزينه را تعيين می کند ، که در هنگام ارسال اطلاعات فرم به سرور استفاده می شود .

مثال : در مثال زير يک ليست بازشو با چندين مقدار ايجاد شده است . همچنين در موارد بعدی انواع خصوصيات تگ select را به صورت عملی بررسی کرده ايم . برای مشاهده گزينه های ديگر ليست ، بر روی آن کليک کنيد :

Example
<select>
  < option value="VB" > Visual Basic < /option >
  < option value="C#" > Visual C# < /option >
  < option value="Asp" selected="selected" > ASP.NET < /option >
  < option value="Sql" > SQL Server < /option >
< /select >
کد
خروجی
در حالت زير ليست غير فعال است .
< select disabled ="disabled">
  < option value="VB" > Visual Basic < /option >
  < option value="C#" > Visual C# < /option >
  < option value="Asp" selected="selected" > ASP.NET < /option >
  < option value="Sql" > SQL Server < /option >
< /select >
کد
خروجی
در حالت زير می توان از ليست بيش از يک گزينه انتخاب کرد .
< select multiple ="multiple">
  < option value="VB" > Visual Basic < /option >
  < option value="C#" > Visual C# < /option >
  < option value="Asp" selected="selected" > ASP.NET < /option >
  < option value="Sql" > SQL Server < /option >
< /select >
کد
خروجی
در حالت زير بيش از يک گزينه از ليست در حالت عادی نمايش داده می شود .
< select size ="3">
  < option value="VB" > Visual Basic < /option >
  < option value="C#" > Visual C# < /option >
  < option value="Asp" selected="selected" > ASP.NET < /option >
  < option value="Sql" > SQL Server < /option >
< /select >
کد
خروجی

* تگ < optgroup > :

از اين تگ برای دسته بندی گزينه های يک ليست در گروه های جدا از هم استفاده می شود . در هنگام زياد بودن موارد ليست ، از اين تگ می توان برای دسته بندی موارد مشابه در گروه های جدا ، جهت سهولت در انتخاب استفاده شود . عنوانی که برای گروه توسط خاصيت label اين تگ تعيين می شود ، به صورت سر گروه و بزرگتر از موارد ديگر ، در ليست نمايش داده می شود ولی عملا قابل انتخاب نيست .
نکته : اين تگ بايد در درون تگ select به کار رود .

خواص مهم تگ optgroup
نام خاصيت نوع خاصيت شرح
disabled disabled در صورتی که مقدار اين خاصيت برابر disabled تنظيم شود ، آن دسته گزينه ليست غير فعال خواهد بود .
label متن
text
عنوان گروه را در ليست تعيين می کند .

مثال : در ليست زير 2 گروه از زبان های برنامه نويسی وب معرفی شده اند :

Example
< select >
  < optgroup label="Server Side Languages" >
     < option value="VB" > Visual Basic < /option >
     < option value="C#" > Visual C# < /option >
     < option value="Asp" selected="selected" > ASP.NET < /option >
     < option value="Sql" > SQL Server < /option >
  < /optgroup >
  < optgroup label="Client Side Languages" >
     < option value="vbscript" > VB Script < /option >
     < option value="javascript" selected="selected" > Java Script < /option >
     < option value="html" > HTML < /option >
  < /optgroup >
< /select >
کد
خروجی


راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی


نظر خودتان درباره این صفحه را با ما در میان بگذارید :

آیا مطالب این صفحه برای شما مناسب و مفید بوده است :

نام :                 
آدرس Email :    
 
نظر شما :  
 
سوال امنیتی : فرزند بچه شما چه نسبتی با شما دارد ؟