الفرق بين المراجعتين لصفحة: «HTML/input/reset»
ط استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}' |
ط استبدال النص - ':(Content sectioning|Edits|Embedded content|Forms|Inline text semantics|Input Types|Interactive elements|Main Root|Metadata|Multimedia|Scripting|Table|Text Content)' ب':HTML $1' |
||
سطر 69: | سطر 69: | ||
|} | |} | ||
[[تصنيف:HTML|{{SUBPAGENAME}}]] | [[تصنيف:HTML|{{SUBPAGENAME}}]] | ||
[[تصنيف:Forms|{{SUBPAGENAME}}]] | [[تصنيف:HTML Forms|{{SUBPAGENAME}}]] | ||
[[تصنيف:Input Types|{{SUBPAGENAME}}]] | [[تصنيف:HTML Input Types|{{SUBPAGENAME}}]] |
مراجعة 15:40، 28 يناير 2018
عناصر <input>
ذات النوع reset
تُعرَض كأزرار لإعادة تعيين عناصر النموذج، فالضغط على أحد تلك الأزرار سيؤدي إلى إعادة تعيين جميع عناصر النموذج إلى قيمها المبدئية.
ملاحظة: ليس من المستحسن عمومًا تضمين أزرار لإعادة التعيين في النماذج، ففائدتها قليلة، وتسبب إزعاجًا للمستخدم إن ضغطها خطأً بدلًا من زر الإرسال.
الخاصية value
تحتوي الخاصية value
في الحقل reset
على سلسلة نصية (DOMString
) التي ستستعمل كلافتة للزر.
<input type="reset" value="Reset the form">
أما إذ لم تُحدَّد قيمة للخاصية value
فستستعمل اللافتة الافتراضية Reset:
<input type="reset">
استخدام أزرار إعادة التعيين
تستخدم أزرار إعادة التعيين لإعادة تعيين جميع حقول النموذج.
زر إعادة تعيين بسيط
هذا مثال بسيط عن زر إعادة التعيين:
<form>
<div>
<label for="example">Type in some sample text</label>
<input id="example" type="text">
</div>
<div>
<input type="reset" value="Reset the form">
</div>
</form>
جرِّب كتابة بعض النص داخل المربع النصي، ثم الضغط على زر إعادة التعيين.
إضافة اختصار إلى الزر عبر لوحة المفاتيح
اختصارات لوحة المفاتيح -والتي تعرف أيضًا باسم مفاتيح الوصول (access keys)- تسمح لمستخدم بتفعيل زر باستخدام تجميعة من الأزرار على لوحة المفاتيح.
لإضافة اختصار لوحة مفاتيح إلى زرٍ ما فاستعمل الخاصية العامة accesskey
.
على سبيل المثال، جعلنا القيمة r
قيمةً للخاصية accesskey
، أي عليك أن تضغط على زر r
إضافةً إلى الزر الذي يستخدم لاختصارات لوحة المفاتيح على نظام تشغيلك (الزر alt
على نظامَي ويندوز ولينكس).
<form>
<div>
<label for="example">Type in some sample text</label>
<input id="example" type="text">
</div>
<div>
<input type="reset" value="Reset the form"
accesskey="r">
</div>
</form>
المشكلة مع المثال السابق هي أنَّ المستخدم لن يعرف ما هو اختصار لوحة المفاتيح للزر السابق! وبالتالي عليك أن توفِّر هذه المعلومات في موقعك بشكلٍ لا يتداخل مع تصميم الموقع (مثل توفير رابط يشرح ما هي اختصارات لوحة المفاتيح المستعملة في الموقع).
تفعيل وتعطيل أزرار إعادة التعيين
لتعطيل أحد أزرار إعادة التعيين فاستخدم الخاصية disabled
عليه، كما في المثال الآتي:
<input type="reset" value="Disabled" disabled>
يمكننا تفعيل وتعطيل الأزرار في وقت التنفيذ عبر ضبط قيمة الخاصية disabled
إلى true
أو false
.
راجع صفحة الحقل button
لمزيدٍ من المعلومات عن تفعيل وتعطيل الأزرار.
التحقق من الحقل
ليس هنالك فائدة من التحقق من قيمة الحقل reset
.
دعم المتصفحات
Chrome | Firefox | Edge | Safari | Opera |
---|---|---|---|---|
مدعوم | مدعوم | مدعوم | مدعوم | مدعوم |