هل هناك طريقة صالحة W3C لتعطيل الإكمال التلقائي في نموذج HTML؟

StackOverflow https://stackoverflow.com/questions/582244

  •  06-09-2019
  •  | 
  •  

سؤال

عند استخدام xhtml1-transitional.dtd Doctype، جمع رقم بطاقة الائتمان مع HTML التالية

<input type="text" id="cardNumber" name="cardNumber" autocomplete='off'/>

سوف يذكر تحذير من Validator W3C:

لا توجد سمة "الإكمال التلقائي".

هل هناك طريقة W3C / معايير لتعطيل المتصفح التلقائي الكامل في الحقول الحساسة في نموذج؟

هل كانت مفيدة؟

المحلول

هنا هي مقال جيد من MDC الذي يفسر المشكلات (والحلول) لتشكيل الإكمال التلقائي. نشرت Microsoft شيئا مشابها هنا, ، كذلك.

أن نكون صادقين، إذا كان هذا شيء مهم لمستخدميك، فإن معايير "كسر" بهذه الطريقة تبدو مناسبة. على سبيل المثال، تستخدم Amazon سمة "الإكمال التلقائي" قليلا، ويبدو أن العمل جيدا.

إذا كنت ترغب في إزالة التحذير بالكامل، يمكنك استخدام JavaScript لتطبيق السمة على المتصفحات التي تدعمها (IE و Firefox هي المتصفحات المهمة) باستخدام someForm.setAttribute( "autocomplete", "off" ); someFormElm.setAttribute( "autocomplete", "off" );

أخيرا، إذا كان موقعك يستخدم https، فلن يقوم IE بإيقاف تشغيل الإكمال تلقائيا (كما تفعل بعض المتصفحات الأخرى، بقدر ما أعرف).

تحديث

نظرا لأن هذه الإجابة لا تزال تحصل على عدد كبير جدا، أردت فقط أن أشير إلى أنه في HTML5، يمكنك استخدام سمة "الإكمال التلقائي" على عنصر النموذج الخاص بك. انظر توثيق على W3C لذلك.

نصائح أخرى

سأفاجأ جدا إذا اقترحت W3C طريقة تعمل مع (X) HTML4. تعتمد ميزة الإكمال التلقائي على المستعرض بالكامل، وقدم خلال السنوات الأخيرة (بعد كتابة معيار HTML4).

لن يفاجأ إذا كان لدى HTML5 واحدة، رغم ذلك.

يحرر: كما اعتقدت، HTML5. هل امتلكه خاصية. لتحديد صفحتك ك HTML5، استخدم DOCTYPE التالي (أي: ضع هذا كنصا الأول جدا في التعليمات البرمجية المصدرية). لاحظ أن لا تدعم جميع المستعرضات هذا المعيار، حيث لا يزال في مسودة نموذج.

<!DOCTYPE html>

أتش تي أم أل 4.: رقم

أتش تي أم أل 5.: نعم

سمة AutoComplete هي سمة تعداد. السمة لديها دولتين. ال على خرائط الكلمات الرئيسية إلى الدولة، و إيقافخرائط الكلمات الرئيسية إلى الدولة خارج الدولة. قد يتم حذف السمة أيضا. القيمة المفقودة الافتراضية هي على حالة. ال إيقاف تشير الحالة إلى أنه بشكل افتراضي، سيحصل عناصر التحكم في النموذج في النموذج على تعيين اسم حقل التمهيدي الخاص بهم إيقاف; ؛ تشير الحالة الموجودة إلى أنه بشكل افتراضي، سيكون عناصر التحكم في النموذج في النموذج autofill تعيين اسم الحقل إلى "ON".

مرجع: W3.

لا، ولكن غالبا ما يتم تشغيل مكمل تلقائي للمتصفح من خلال الحقل name السمة كحقول تم ملؤها مسبقا. إذا كنت تستطيع التززف بطريقة ذكية للحصول على اسم المجال العشوائي, ، لن تكون الإكمال التلقائي قادرا على سحب أي قيم تم إدخالها مسبقا للحقل.

إذا كنت تعطي حقل إدخال اسم مثل "email_<?= randomNumber() ?>"، ثم لديك البرنامج النصي الذي يتلقى حلقة البيانات هذه من خلال منشور أو الحصول على متغيرات تبحث عن شيء مطابق للنمط"email_[some number]"، يمكنك سحب هذا، وهذا سيكون له (عمليا) النجاح المضمون، بغض النظر عن المتصفح.

لا، مقالة جيدة هنا في موزيلا ويكي.

أود أن أستمر في استخدام غير صالح attribute. وبعد أعتقد أن هذا هو المكان الذي يجب أن يفوز البراغماتية على التحقق من الصحة.

ماذا عن إعداده مع جافا سكريبت؟

var e = document.getElementById('cardNumber');
e.autocomplete = 'off'; // Maybe should be false

انها ليست مثالية، لكن HTML سيكون صالحا.

أقترح اصطياد جميع أنواع الإدخال الأربعة:

$('form,input,select,textarea').attr("autocomplete", "off");

مرجع:

إذا كنت تستخدم JQuery، فيمكنك القيام بشيء من هذا القبيل:

$(document).ready(function(){$("input.autocompleteOff").attr("autocomplete","off");});

واستخدام فئة AutoColleteFFOFF حيث تريد:

<input type="text" name="fieldName" id="fieldId" class="firstCSSClass otherCSSClass autocompleteOff" />

إذا كنت تريد أن تكون كل المدخلات الخاصة بك autocomplete=off, ، يمكنك ببساطة استخدام ذلك:

$(document).ready(function(){$("input").attr("autocomplete","off");});

طريقة أخرى - والتي ستساعد أيضا في الأمان هي استدعاء مربع الإدخال شيء مختلف في كل مرة تقوم فيه بعرضها: تماما مثل Captha. بهذه الطريقة، يمكن أن تقرأ الجلسة لمرة واحدة فقط الإدخال والكامل التلقائي لا علاقة له.

مجرد نقطة بخصوص مسألة RMeador حول ما إذا كان يجب أن تتداخل في تجربة المتصفح: نقوم بتطوير أنظمة إدارة الاتصال وإدارة CRM، وعندما تكتب بيانات الأشخاص الآخرين في شكل لا تريدها باستمرار تفاصيلك الخاصة.

هذا يعمل لاحتياجاتنا، ولكن بعد ذلك لدينا ترف إخبار المستخدمين للحصول على متصفح لائق :)

autocomplete='off'

autocomplete="off" هذا يجب إصلاح المشكلة لجميع المتصفحات الحديثة.

<form name="form1" id="form1" method="post" autocomplete="off"
   action="http://www.example.com/form.cgi">
  [...]
</form>

في الإصدارات الحالية من متصفحات Gecko، تعمل سمة الإكمال التلقائي تماما. للإصدارات السابقة، والعودة إلى Netscape 6.2، فقد عملت باستثناء النماذج مع "العنوان" و "الاسم"

تحديث

في بعض الحالات، سيواصل المتصفح اقتراح بقيم الإكمال التلقائي حتى إذا تم ضبط سمة الإكمال التلقائي. يمكن أن يكون هذا السلوك غير المتوقع محيرا للغاية بالنسبة للمطورين. الخدعة لإجبارها حقا على عدم التلقائي تعيين سلسلة عشوائية إلى السمة, ، علي سبيل المثال:

autocomplete="nope"

لأن هذه القيمة العشوائية ليست valid one, ، سوف يستسلم المتصفح.

documetation.

باستخدام سمة "اسم" عشوائي يعمل بالنسبة لي.

أعد ضبط سمة الاسم عند إرسال النموذج حتى لا يزال بإمكانك الوصول إليه بالاسم عند إرسال النموذج. (استخدام سمة المعرف لتخزين الاسم)

لاحظ أن هناك بعض الارتباك حول موقع سمة الإكمال التلقائي. يمكن تطبيقها إما على علامة النموذج بأكملها أو علامات الإدخال الفردية، وهذا لم يكن موحدا حقا قبل HTML5 (يتيح ذلك صراحة على حد سواء المواقع). مستندات كبار السن بشكل خاص موزيلا المادة يذكر فقط علامة النموذج. في الوقت نفسه، ستبحث بعض ماسحات ضوئية أمنية فقط عن الإكمال في علامة الإدخال وشكوى إذا فقدت (حتى لو كان ذلك يكون في شكل الوالد). يتم نشر تحليل أكثر تفصيلا لهذه الفوضى هنا: الارتباك على الإكمال التلقائي = إيقاف السمات في نماذج HTML.

ليس مثاليا، ولكن يمكنك تغيير معرف واسم مربع النص في كل مرة تقوم فيها بعرضها - سيتعين عليك تتبع جانب خادم تكنولوجيا المعلومات أيضا حتى تتمكن من إخراج البيانات.

لست متأكدا مما إذا كان هذا سيعمل أم لا، كان مجرد فكرة.

أعتقد أن هناك طريقة أبسط. قم بإنشاء مدخلات مخفية مع اسم عشوائي (عبر JavaScript) وقم بتعيين اسم المستخدم على ذلك. كرر مع كلمة المرور. بهذه الطريقة يعرف البرنامج النصي الخلفي الخاص بك بالضبط ما هو اسم الحقل المناسب، مع الحفاظ على الإكمال التلقائي في الظلام.

ربما أكون مخطئا، لكنها مجرد فكرة.

if (document.getElementsByTagName) {
    var inputElements = document.getElementsByTagName("input");
    for (i=0; inputElements[i]; i++) {
        if (inputElements[i].className && (inputElements[i].className.indexOf("disableAutoComplete") != -1)) {
            inputElements[i].setAttribute("autocomplete","off");
        }
    }
}

يعمل هذا الحل معي:

$('form,input,select,textarea').attr("autocomplete", "nope");

إذا كنت تريد استخدام التدوير التلقائي في هذه المنطقة: إضافة autocomplete="false" في العنصر السابقين:

<input id="search" name="search" type="text" placeholder="Name or Code" autcomplete="false">

التلقائي الصالح قبالة

<script type="text/javascript">
    /* <![CDATA[ */
    document.write('<input type="text" id="cardNumber" name="cardNumber" autocom'+'plete="off"/>');
    /* ]]> */ 
</script>
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top