تعليق: يقدم هذا المقال بشكل أساسي مثال استخدام علامات Datalist HTML5 (المكون الكامل تلقائيًا). يمكن للأصدقاء الذين يحتاجون إليها الرجوع إليها
في الماضي ، كنت بحاجة إلى كتابة مكون إكمال تلقائي (اقترح) في JS ، وهو أمر صعب للغاية. في عصر HTML5 ، لم يعد ضروريًا. يستخدم علامات Datalist مباشرة ، مما يقلل مباشرة من عبء العمل. على النحو التالي
<! doctype html>
<html>
<head>
<title> HTML5 Datalist Tag </title>
<meta charset = "utf-8">
</head>
<p>
إصدار المتصفح: <input list = "words">
</p>
<stalist>
<Option Value = "Internet Explorer">
<value Option = "Firefox">
<value Option = "Chrome">
<value Option = "Opera">
<خيار القيمة = "Safari">
<value Option = "Sogou">
<خيار القيمة = "maxthon">
</datalist>
</body>
</html>
يوفر Datalist قائمة محددة مسبقًا ، والتي ترتبط بالإدخال من خلال المعرف. عند إدخال الإدخال في الإدخال ، ستكون هناك وظيفة إكمال تلقائي ، وسيشاهد المستخدم قائمة منسدلة للاختيار.
يتم دعم Chrome/Firefox/Opera و IE10+ ، ولا يزال Safari غير مدعوم حتى الإصدار 7.