دروس HTML

صفحة HTML الرئيسية مقدمة HTML محرري HTML أساسيات HTML عناصر HTML سمات HTML عناوين HTML فقرات HTML أنماط HTML تنسيق HTML اقتباسات HTML تعليقات HTML ألوان HTML HTML CSS روابط HTML صور HTML رمز HTML المفضل جداول HTML قوائم HTML كتلة HTML ومضمنة فئات HTML معرف HTML إطارات HTML IFrame HTML جافا سكريبت مسارات ملفات HTML رئيس HTML تنسيق HTML مستجيب لـ HTML HTML Computercode دلالات HTML دليل نمط HTML كيانات HTML رموز HTML HTML Emojis أحرف HTML تشفير عنوان URL لـ HTML HTML مقابل XHTML

نماذج HTML

نماذج HTML سمات نموذج HTML عناصر نموذج HTML أنواع إدخال HTML سمات إدخال HTML سمات نموذج إدخال HTML

رسومات HTML

قماش HTML HTML SVG

وسائط HTML

وسائط HTML فيديو HTML صوت HTML المكونات الإضافية لـ HTML HTML يوتيوب

واجهات برمجة تطبيقات HTML

HTML تحديد الموقع الجغرافي سحب / إسقاط HTML تخزين الويب HTML عمال ويب HTML HTML SSE

أمثلة HTML

أمثلة HTML مسابقة HTML تمارين HTML شهادة HTML ملخص HTML ولوجية HTML

مراجع HTML

قائمة علامات HTML سمات HTML سمات HTML العامة دعم متصفح HTML أحداث HTML ألوان HTML قماش HTML صوت / فيديو HTML أنماط HTML مجموعات أحرف HTML تشفير عنوان URL لـ HTML أكواد HTML لانج رسائل HTTP طرق HTTP PX to EM Converter اختصارات لوحة المفاتيح

نموذج إدخال HTML * السمات


يصف هذا الفصل form*السمات المختلفة <input>لعنصر HTML.


سمة النموذج

formتحدد سمة الإدخال الشكل الذي <input>ينتمي إليه العنصر.

يجب أن تكون قيمة هذه السمة مساوية لسمة id لعنصر <form> الذي تنتمي إليه.

مثال

حقل إدخال يقع خارج نموذج HTML (لكنه لا يزال جزءًا من النموذج):

<form action="/action_page.php" id="form1">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="Submit">
</form>

<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname" form="form1">

سمة Formaction

تحدد سمة الإدخال formactionعنوان URL للملف الذي سيعالج الإدخال عند إرسال النموذج.

ملاحظة: تتجاوز هذه السمة actionسمة <form>العنصر.

تعمل formactionالسمة مع أنواع الإدخال التالية: الإرسال والصورة.

مثال

نموذج HTML به زري إرسال ، بإجراءات مختلفة:

<form action="/action_page.php">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Last name:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Submit">
  <input type="submit" formaction="/action_page2.php" value="Submit as Admin">
</form>

سمة formenctype

تحدد سمة الإدخال formenctype كيفية تشفير بيانات النموذج عند إرسالها (فقط للنماذج ذات الأسلوب = "post").

ملاحظة: تتجاوز هذه السمة سمة enctype <form>للعنصر.

تعمل formenctypeالسمة مع أنواع الإدخال التالية: الإرسال والصورة.

مثال

نموذج يحتوي على زري إرسال. الأول يرسل بيانات النموذج مع التشفير الافتراضي ، والثاني يرسل بيانات النموذج المشفرة على أنها "متعددة الأجزاء / بيانات النموذج":

<form action="/action_page_binary.asp" method="post">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="Submit">
  <input type="submit" formenctype="multipart/form-data"
  value="Submit as Multipart/form-data">
</form>

سمة النموذج

تحدد سمة الإدخال formmethod طريقة HTTP لإرسال بيانات النموذج إلى عنوان URL للإجراء.

ملاحظة: تتجاوز هذه السمة سمة الأسلوب الخاصة <form>بالعنصر.

تعمل formmethodالسمة مع أنواع الإدخال التالية: الإرسال والصورة.

يمكن إرسال بيانات النموذج كمتغيرات URL (الطريقة = "الحصول على") أو كمعاملة HTTP بعد (الطريقة = "النشر").

ملاحظات حول طريقة "get":

  • تلحق هذه الطريقة بيانات النموذج بعنوان URL في أزواج الاسم / القيمة
  • هذه الطريقة مفيدة لعمليات إرسال النماذج حيث يريد المستخدم وضع إشارة مرجعية على النتيجة
  • هناك حد لمقدار البيانات التي يمكنك وضعها في عنوان URL (يختلف باختلاف المستعرضات) ، لذلك لا يمكنك التأكد من نقل جميع بيانات النموذج بشكل صحيح
  • لا تستخدم أبدًا طريقة "get" لتمرير معلومات حساسة! (ستكون كلمة المرور أو غيرها من المعلومات الحساسة مرئية في شريط عنوان المتصفح)

ملاحظات حول طريقة "النشر":

  • ترسل هذه الطريقة بيانات النموذج كعملية نشر HTTP
  • لا يمكن وضع إشارة مرجعية على عمليات إرسال النموذج باستخدام طريقة "النشر"
  • تعتبر طريقة "النشر" أكثر قوة وأمانًا من طريقة "get" ، كما أن طريقة "post" لا تتضمن قيودًا على الحجم

مثال

نموذج يحتوي على زري إرسال. الأول يرسل بيانات النموذج بالطريقة = "get". الثانية ترسل بيانات النموذج بالطريقة = "post":

<form action="/action_page.php" method="get">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Last name:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Submit using GET">
  <input type="submit" formmethod="post" value="Submit using POST">
</form>

سمة formtarget

formtargetتحدد سمة الإدخال اسمًا أو كلمة أساسية تشير إلى مكان عرض الاستجابة التي تم تلقيها بعد إرسال النموذج.

ملاحظة: تتجاوز هذه السمة السمة الهدف <form>للعنصر.

تعمل formtargetالسمة مع أنواع الإدخال التالية: الإرسال والصورة.

مثال

نموذج يحتوي على زري إرسال ، بنوافذ هدف مختلفة:

<form action="/action_page.php">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Last name:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Submit">
  <input type="submit" formtarget="_blank" value="Submit to a new window/tab">
</form>

سمة Formnovalidate

تحدد سمة الإدخال formnovalidateأنه لا ينبغي التحقق من صحة عنصر <input> عند إرساله.

ملاحظة: تتجاوز هذه السمة سمة novalidate <form> للعنصر.

تعمل formnovalidateالسمة مع أنواع الإدخال التالية: إرسال.

مثال

نموذج به زري إرسال (مع أو بدون التحقق):

<form action="/action_page.php">
  <label for="email">Enter your email:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="Submit">
  <input type="submit" formnovalidate="formnovalidate"
  value="Submit without validation">
</form>

السمة novalidate

السمة novalidateهي <form>سمة.

عند وجودها ، تحدد novalidate أنه لا ينبغي التحقق من صحة جميع بيانات النموذج عند إرسالها.

مثال

حدد عدم وجوب التحقق من صحة بيانات النموذج عند الإرسال:

<form action="/action_page.php" novalidate>
  <label for="email">Enter your email:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="Submit">
</form>

نموذج HTML وعناصر الإدخال

Tag Description
<form> Defines an HTML form for user input
<input> Defines an input control

للحصول على قائمة كاملة بجميع علامات HTML المتاحة ، تفضل بزيارة مرجع علامات HTML الخاص بنا .