دليل مرجعي لـ HTML

كامل قائمة علامات HTML

HTML: <i> العلامة HTML: <footer> العلامة

HTML: <form> العلامة

يستخدم علامة <form> في HTML لإنشاء نماذج على صفحات الويب تحتوي على عناصر تفاعلية للإدخال، للاستخدام في تقديم معلومات إلى خادم الويب. وتسمى هذه العلامة أيضًا علامة <form>.

مثال عبر الإنترنت

نموذج HTML يحتوي على مجالين للإدخال و زر تقديم:

مثال

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>استخدام علامة footer في HTML5 (موقع تعليمي أساسي - oldtoolbag.com)</title>
</head>
<body>
<h1>دليل oldtoolbag.com الأساسي</h1>
<form action="demo-form.php" method="post">
　　الشركة: <input type="text" name="company"><br>
　　العنوان: <input type="text" name="address"><br>
　　<input type="submit" value="Submit">
</form>
</body>
</html>

الاختبار

في هذا مثال على مستند HTML5، استخدمنا علامة <form> لإنشاء نموذج HTML. يحتوي هذا النموذج على عناصر <input> لشركة العنوان و زر التقدم.

المعالجة النهائية بعد التنفيذ:}}

تطابق المتصفحات

IEFirefoxOperaChromeSafari

يدعم جميع المتصفحات الرئيسية علامة <form>.

ملاحظات عند استخدام العلامات

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

تعريف العلامات واستخداماتها

يستخدم علامة <form> لإنشاء نموذج HTML يمكن للمرء من خلاله إدخال البيانات.

يحتوي عنصر <form> على عنصر أو أكثر من العناصر التالية:

الفرق بين HTML 4.01 وHTML5

أضاف HTML5 خاصيتين جديدتين: autocomplete وnovalidate، ولم يعد يدعم بعض الخاصيات في HTML 4.01.

الفرق بين HTML وXHTML

في XHTML، تم التخلي عن خاصية name. استخدم خاصية id العالمية بدلاً منها.

خاصية

جديد: خاصية جديدة في HTML5.

خاصية	قيمة	وصف
accept	MIME_type	HTML5 لا يدعم. يحدد نوع الملف الذي سيتم استقباله من قبل الخادم. (الملفات يتم إرسالها عبر تحميل ملف)
accept-charset	character_set	يحدد مجموعة الحروف التي يمكن استخدامها لبيانات النموذج التي يمكن أن يتم معالجتها من قبل الخادم.
action	URL	يحدد إلى أين سيتم إرسال بيانات النموذج عند تقديم النموذج.
autocompleteHTML5	on off	يحدد ما إذا كان يتم تمكين ميزة إكمال النموذج التلقائي.
enctype	application/x-www-form-urlencoded multipart/form-data text/plain	يحدد كيفية تعيين بيانات النموذج قبل إرسالها إلى الخادم. (للمethod="post" فقط)
method	get 　post	يحدد الطريقة التي سيتم استخدامها لإرسال بيانات النموذج عبر HTTP.
name	text	يحدد اسم النموذج.
novalidateHTML5	novalidate	إذا تم استخدام هذه الخاصية، فإنه لن يتم التحقق من صحة البيانات عند تقديم النموذج.
هدف	_blank 　_self 　_parent 　_top	يحدد أين يفتح URL action.

خصائص العالمية

دعم <form> العلامة خصائص العالمية في HTML.

خصائص الحدث

دعم <form> العلامة خصائص الحدث في HTML.

تجربة المثال عبر الإنترنت

الأزرار المختارة (Radio buttons)
هذا المثال يوضح كيفية إنشاء أزرار اختيار في HTML.

المربعات المختارة (Checkboxes)
هذا المثال يوضح كيفية إنشاء مربعات اختيار في صفحة HTML. يمكن للمستخدم اختيار أو إلغاء اختيار مربعات الاختيار.

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

القائمة المنسدلة المسبقة
هذا المثال يوضح كيفية إنشاء قائمة منسدلة بقيمة مسبقة.

حقل النص (Textarea)
هذا المثال يوضح كيفية إنشاء حقل نصي (مستقبل نصي متعدد الخطوط). يمكن للمستخدم كتابة النص في الحقل النصي. لا يوجد حد للعدد من الأحرف القابلة للكتابة.

إنشاء زر
هذا المثال يوضح كيفية إنشاء زر. يمكنك تخصيص النص على الزر.

المقالات ذات الصلة

درس HTML:نماذج HTML ومدخلات

دليل مرجع HTML DOM: عنصر Form

HTML: <i> العلامة HTML: <footer> العلامة