تعليق: تتيح لنا وظيفة HTML البسيطة الآن تحديد موقع تركيز الإدخال تلقائيًا على العناصر المطلوبة بعد تحميل الصفحة. يتم الانتهاء من خلال سمة تسمى التركيز التلقائي. يمكن للأصدقاء المهتمين التعرف على ذلك.
النص الأصلي: HTML5 Autofocus يعزى
تاريخ الإصدار الأصلي: 27 أغسطس 2012
وقت الترجمة: 6 أغسطس 2013
أطلقت HTML5 الكثير من الأشياء الرائعة بالنسبة لنا.
في الماضي ، يمكن الآن إكمال المهام التي أردنا إكمالها مع JavaScript و Flash ، مثل التحقق من النماذج ، ومطالبات الإدخال الفارغة (المدخلات المترجمة) ، وتحميل ملفات العميل وتنزيلها (تسمية ملف جانبي العميل) ، وتشغيل الصوت/الفيديو ، مع HTML الأساسي. ميزة HTML بسيطة أخرى هي أنها تتيح لنا الآن تحديد موقع تركيز الإدخال تلقائيًا على العنصر المطلوب بعد تحميل الصفحة ، وإكمالها من خلال خاصية تسمى التركيز التلقائي.
الرمز بسيط مثل ما يلي:
<!- كل هذا العمل! ->
<الإدخال AutoFocus = "Autofocus" />
<button autofocus = "AutoFocus"> HI! </utron>
<textarea autofocus = "Autofocus"> </sextarea>
بعد تعيين خاصية التركيز التلقائي ، سيتم تحديد عناصر الإدخال والنص والزر تلقائيًا بعد تحميل الصفحة (أي ، اكتساب التركيز). جربت عناصر أخرى (مثل علامة H1) ، Tabindex = 0 ، لكن خاصية التركيز التلقائي ليس لها أي تأثير على هذه العناصر على الإطلاق.
هذه السمة مفيدة في الغرض الرئيسي من الحصول على الصفحات التي غرضها الرئيسي هو جمع المعلومات ، مثل صفحة Google الرئيسية (يتم استخدام 99 ٪ من الحالات للبحث) أو معالجات التثبيت عبر الإنترنت (مثل تثبيت WordPress). والشيء الأكثر أهمية هو أن JavaScript لا يتطلب المشاركة.
رمز الصفحة الكامل كما يلي:
<! doctype html>
<html>
<head>
<title> اختبار سمة التركيز التلقائي HTML5 </title>
<meta content = "editPlus">
<meta content = "[email protected]">
<meta content = "Original = http: //davidwalsh.name/autofocus">
</head>
<body>
<!- من حيث المبدأ ، يمكن تعيين واحد فقط من العناصر الثلاثة التالية. إذا تم تعيين عناصر متعددة ، فيجب أن يحصل العنصر الأخير على التركيز->
<!-
->
<viv>
<الإدخال AutoFocus = "Autofocus" />
<button autofocus = "AutoFocus"> HI! </utron>
<textarea autofocus = "Autofocus"> </sextarea>
</div>
</body>
</html>