قد تبدو هذه الميزة غير مثيرة للإعجاب، ولكن أعتقد أنّها مهمة لأنّ الجميع يكرهون الكتابة على الأجهزة الجوّالة: أنت تكرهها، وأنا أكرهها. في Chrome لأجهزة Android (قبل الإصدار التجريبي من Chrome 43 اعتبارًا من نيسان (أبريل) 2015)، لا يمكن للمطوّر التحكّم كثيرًا في الطريقة التي يمكن للمتصفّح من خلالها مساعدة المستخدم في إدخال النص. إذا كنت تكتب على جهاز اليوم، قد يبدو الأمر على النحو التالي:
يُرجى ملاحظة أنّ كل العناصر مكتوبة بأحرف صغيرة باستثناء بعض القيم التي تعرّف عليها Android على أنّها أسماء.
طرحت Apple سمة في HTMLInputElement
و
HTMLTextAreaElement
تُسمى autocapitalize في iOS 5
وتسمح لمؤلف الصفحة بالتلميح إلى كيفية عرض المتصفّح ل keyboard الافتراضية للمستخدم من أجل تحسين إدخال النص. في أبسط أشكاله، يمكنك الإشارة إلى أنّه يجب أن يكتب مربّع النص تلقائيًا الحرف الأول من كل جملة جديدة بحرف لاتيني كبير.
اعتبارًا من الإصدار 43 من Chrome، سيتيح Chrome استخدام السمة autocapitalize في كلٍّ من
HTMLInputElement
وHTMLTextAreaElement
، ما سيتيح لك التحكّم في
سلوك الكتابة التلقائية بأحرف كبيرة في لوحة المفاتيح الافتراضية وإدراجها في سطر واحد
مع Safari على iOS.
لن تنطبق السمة autocapitalize إلا على HTMLInputElement
التي تم ضبط سمة type فيها على: type="text"
أو type="search"
أو type="url"
أو type="tel"
أو
type="email"
أو type="password"
. الإعداد التلقائي هو عدم استخدام ميزة "كتابة الأحرف اللاتينية بحروف كبيرة تلقائيًا".
في ما يلي مثال بسيط يتيح لك ضبط الجمل تلقائيًا على أنّها تبدأ بحرف كبير في منطقة نصية:
<textarea autocapitalize="sentences">
ما هي القيم التي يمكن أن تتّخذها ميزة "كتابة الأحرف اللاتينية بحروف كبيرة تلقائيًا"؟
يعرض الجدول التالي الحالات المختلفة التي يمكن أن يكون فيها عنصر الإدخال:
الحالة | الكلمات الرئيسية | |
---|---|---|
<input> <input autocapitalize=off>
|
بدون كتابة الأحرف اللاتينية الكبيرة | بدون [تلقائي] |
إيقاف | ||
<input autocapitalize=characters> |
الكتابة بالأحرف اللاتينية الكبيرة | الأحرف |
<input autocapitalize=words> |
الكتابة بالأحرف اللاتينية الكبيرة | الكلمات |
<input autocapitalize=sentences> |
الكتابة بالأحرف اللاتينية الكبيرة في الجمل | الجُمل |
بالنسبة إلى HTMLInputElement
، تكون القيمة التلقائية غير الصالحة هي كتابة الجمل بالأحرف اللاتينية الكبيرة إذا كان نوع العنصر هو type=text
أو type=search
. بخلاف ذلك، تكون القيمة عدم كتابة الجمل بالأحرف اللاتينية الكبيرة.
<input autocapitalize="simon">
هو حقل نصي يتضمّن كتابة الجمل بالأحرف الكبيرة.<input type="email" autocapitalize="simon">
هو حقل نصي مع عدم كتابة الأحرف الكبيرة.<input>
هو حقل نصي مع عدم كتابة الأحرف الكبيرة.
بالنسبة إلى HTMLTextAreaElement
، تكون القيمة التلقائية غير الصالحة هي الجمل
التكبير/التصغير. هذا تغيير عن السلوك التلقائي.
<textarea autocapitalize="terry"></textarea>
ستكون منطقة نصية تتضمّن كتابة الجمل بالأحرف الكبيرة<textarea></textarea>
هي منطقة نصية تستخدم كتابة الأحرف بنظام الجملة.<textarea autocapitalize="none"></textarea>
هي منطقة نصّ مع عدم كتابة الأحرف الكبيرة.
بالنسبة إلى HTMLFormElement
، قرّرنا عدم تنفيذ السمة لأنّنا
لاحظنا أنّه نادرًا ما يتم استخدامها في الصفحات اليوم، وعند استخدامها، يتم استخدامها في الغالب
لتعطيل الكتابة بالأحرف اللاتينية الكبيرة تلقائيًا في النموذج بالكامل:
<form autocapitalize=off><input></form>
هذه الحالة غير متوقّعة، لأنّ الحالة التلقائية لسمة HTMLInputElement
هي بدون استخدام الأحرف الكبيرة.
لماذا تستخدم هذا الإجراء بدلاً من inputmode
؟
inputmode
مخصّص لحلّ النوع نفسه من المشاكل، من بين أمور أخرى.
ومع ذلك، لم يتم تنفيذه في المتصفّحات، وحسب علمنا، فإنّ Firefox OS هو المتصفّح الوحيد الذي ينفّذ هذا الإجراء مع إضافة البادئة (x-inputmode)، ولكنّه لا يُستخدَم كثيرًا على الويب. من ناحية أخرى، يتم استخدام
autocapitalize
في ملايين الصفحات على مئات الآلاف من
المواقع الإلكترونية.
متى يجب استخدام هذه الميزة؟
هذه ليست قائمة شاملة بالحالات التي يجب فيها استخدام autocapitalize
، ومع ذلك،
هناك عدد من المواضع التي تُحقّق فيها مساعدة المستخدم في إدخال النص قيمة كبيرة:
- استخدِم
autocapitalization=words
إذا كنت:- أسماء الأشخاص المتوقّعة (ملاحظة: لا تتبع بعض الأسماء هذه القاعدة، ولكن سيتم تلقائيًا استخدام الأحرف اللاتينية الكبيرة في غالبية الأسماء الغربية على النحو المتوقّع)
- أسماء الشركات
- العناوين
- استخدِم
autocapitalization=characters
إذا كنت تتوقّع:- الولايات الأمريكية
- الرموز البريدية في المملكة المتحدة
- استخدِم
sentences
لعناصر الإدخال إذا كنت تتوقّع محتوى يتم إدخاله في شكل فقرة عادية، مثل مشاركة مدوّنة. - استخدِم
none
في TextAreas إذا كنت تتوقّع ظهور محتوى لا يتأثر بالتغييرات، مثل إدخال رمز. - إذا كنت لا تريد استخدام التلميح، لا تضيف ميزة "كتابة الأحرف اللاتينية بأحرف كبيرة تلقائيًا".