18- كورس HTML للمبتدئين – حقول الإدخال Input بأنواعها

حقول الإدخال وأنواعها

مقدمة عن حقول الإدخال

تعد حقول الإدخال أحد أهم عناصر واجهة المستخدم في تطبيقات الويب، حيث تتيح للمستخدمين إدخال البيانات والتفاعل مع النظام. تتميز حقول الإدخال بتنوعها في الأشكال والوظائف، مما يجعلها مناسبة لمختلف السيناريوهات والتطبيقات. يمكن أن تشمل هذه الحقول إدخال النصوص، الأرقام، التواريخ، الخيارات المتعددة، والعديد من الأنواع الأخرى التي تساعد في تسهيل تجربة المستخدم.

أنواع حقول الإدخال

تتنوع حقول الإدخال بناءً على نوع البيانات التي يتم إدخالها والوظيفة المطلوبة منها. من ضمن الأنواع الأكثر شيوعاً هي حقول النصوص التي تسمح بإدخال نصوص حرة، وحقول الأرقام التي تقبل إدخال القيم الرقمية فقط. هناك أيضًا حقول مخصصة لاختيار التواريخ، حيث يمكن للمستخدمين تحديد تاريخ معين من خلال تقويم منبثق. بالإضافة إلى ذلك، هناك حقول الإدخال التي تسمح للمستخدم باختيار خيار واحد أو أكثر من مجموعة محددة مسبقاً، مثل قوائم الاختيار المنسدلة أو مربعات الاختيار.

أمثلة على حقول الإدخال

تتعدد الأمثلة على حقول الإدخال واستخداماتها في تطبيقات الويب. على سبيل المثال، في نموذج تسجيل المستخدم قد نجد حقلاً لإدخال الاسم الكامل، وآخر لإدخال البريد الإلكتروني، وحقلًا لاختيار تاريخ الميلاد باستخدام تقويم. في تطبيقات التجارة الإلكترونية، قد نجد حقولًا لإدخال العنوان ورقم الهاتف، بالإضافة إلى قوائم منسدلة لاختيار طريقة الدفع.

مثال:
<label for=\"name\">الاسم:</label>
        


        
        <label for=\"email\">البريد الإلكتروني:</label>
        


        
        <label for=\"dob\">تاريخ الميلاد:</label>
        


        
        <label for=\"quantity\">الكمية:</label>
        


        
        <label for=\"payment-method\">طريقة الدفع:</label>
        
            بطاقة ائتمان
            باي بال

الخاتمة

تعكس حقول الإدخال مدى تنوع وتعدد الخيارات المتاحة في تصميم واجهات المستخدم، حيث تلعب دورًا حيويًا في تسهيل التواصل بين المستخدم والنظام. يجب على المطورين اختيار النوع المناسب من حقل الإدخال بناءً على نوع البيانات والوظيفة المطلوبة لضمان تجربة مستخدم سلسة وفعالة.