web-dev-qa-db-ja.com

HTMLフォームでオートコンプリートを無効にするW3Cの有効な方法はありますか?

xhtml1-transitional.dtd doctypeを使用するときは、次のHTMLでクレジットカード番号を収集してください。

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

w3Cバリデータに警告を出すでしょう:

属性 "autocomplete"はありません。

フォーム内の機密フィールドでブラウザのオートコンプリートを無効にするW3C /標準の方法はありますか?

418
matt b

ここで はMDCからの良い記事で、オートコンプリートを形成するための問題(および解決策)を説明しています。 Microsoftはここでも同様のもの を公開しています

正直に言うと、これがユーザーにとって重要なものであれば、このように「標準を破る」ことが適切であると思われます。たとえば、Amazonはかなり「自動補完」属性を使用しており、うまく機能しているようです。

警告を完全に削除したい場合は、someForm.setAttribute( "autocomplete", "off" ); someFormElm.setAttribute( "autocomplete", "off" );を使用して、それをサポートするブラウザ(IEとFirefoxが重要なブラウザ)にJavaScriptを使用して属性を適用することができます。

最後に、あなたのサイトがHTTPSを使用している場合、IEは自動補完を自動的にオフにします(私の知る限りでは他のブラウザと同様に)。

更新

この回答にはまだかなりの支持が寄せられているので、HTML 5ではフォーム要素に 'autocomplete'属性を使用できることを指摘しておきます。それについてはW3Cの ドキュメント を見てください。

417
Nick Presta

W3Cが(X)HTML4で動作するような方法を提案したら、私は非常に驚きます。オートコンプリート機能は完全にブラウザベースであり、ここ数年の間に導入されました(HTML4標準が書かれたかなり後)。

HTML5があれば驚かないでしょう。

編集:私が思ったように、 HTML5はそれを持っています 特徴。ページをHTML 5として定義するには、次のDoctypeを使用します(つまり、これをソースコードの最初のテキストとして配置します)。まだドラフト形式であるため、すべてのブラウザがこの標準をサポートしているわけではありません。

<!DOCTYPE html>
63
Henrik Paul

HTML 4:いいえ

HTML 5:はい

Autocomplete属性は列挙属性です。属性には2つの状態があります。 onキーワードはon状態にマッピングされ、offキーワードはoff状態にマッピングされます。属性は省略することもできます。欠損値のデフォルトは、on状態です。 off状態は、デフォルトで、フォーム内のフォームコントロールの自動入力フィールド名がoffに設定されることを示します。 on状態は、デフォルトでは、フォーム内のフォームコントロールのautofillフィールド名が "on"に設定されることを示します。

参考: W3

56
RuudKok

いいえ。ただし、ブラウザのオートコンプリートは、以前に入力されたフィールドと同じname属性を持つフィールドによって引き起こされることがよくあります。あなたがランダム化されたフィールド名を持つための賢い方法を準備できたら、オートコンプリートはそのフィールドに以前に入力された値を引き出すことができないでしょう。

入力フィールドに "email_<?= randomNumber() ?>"のような名前を付けてから、このデータを受け取るスクリプトがPOSTまたはGET変数をループして、パターン "email_[some number]"に一致するものを探すようにすると、次のようになります。これをオフにすると、ブラウザに関係なく、(実質的に)成功が保証されます

32
Phantom Watson

いいえ、Mozilla Wikiに良い記事があります。

無効なattributeを引き続き使用します。私はこれが実用主義が検証に勝るべきところであると思います。

31
David Waters

JavaScriptで設定するのはどうですか?

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

それは完璧ではありませんが、あなたのHTMLは有効になります。

23
Greg

4種類の入力すべてをキャッチすることをお勧めします。

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

参照:

19
Malartre

JQueryを使用している場合は、次のようにすることができます。

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

そして、必要な場所にautocompleteOffクラスを使用します。

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

すべての入力をautocomplete=offにしたい場合は、単純にそれを使用できます。

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

autocomplete="off"これは最近のすべてのブラウザの問題を解決するはずです。

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

Geckoブラウザの現在のバージョンでは、autocomplete属性は完璧に機能します。以前のバージョンでは、Netscape 6.2に戻り、 "Address"と "Name"を持つフォームの例外を除いて動作しました。

更新

場合によっては、autocomplete属性がoffに設定されていても、ブラウザは自動補完値を提案し続けます。この予想外の振る舞いは開発者にとってかなり戸惑うことがあります。本当に自動補完を強制しないためのトリックは、属性にランダムな文字列を代入することです。例えば:

autocomplete="nope"

このランダムな値はvalid oneではないので、ブラウザはあきらめます。

文書化

8
Emilio Gort

もう1つの方法 - セキュリティ上も役立つのは、入力ボックスを表示するたびに別の名前を呼び出すことです。これは、キャプチャのようにです。このようにして、セッションは1回限りの入力を読み取ることができ、オートコンプリートは続行することができません。

ブラウザ体験を妨げるべきかどうかについてのrmeadorの質問に関するポイント:私たちはContact Management&CRMシステムを開発しています、そしてあなたが他の人のデータをフォームにタイプしているときあなたはそれがあなた自身の詳細を絶えず提案したくないです。

これは私たちの必要性のために働きます、しかしそれから私たちはユーザーにまともなブラウザを手に入れるように言うことの贅沢を持っています:)

autocomplete='off' 
8
Enigma Plus

ランダムな 'name'属性を使うのは私にとってはうまくいきます。

フォームを送信するときに名前属性をリセットするので、フォームが送信されるときに名前でアクセスできます。 (名前を格納するためにid属性を使う)

6
opznhaarlems

Autocomplete属性の場所について混乱があることに注意してください。これは、FORMタグ全体または個々のINPUTタグのどちらにも適用できます。これは、HTML 5の前には標準化されていません(つまり、 both場所 )。これより古いドキュメントで最も注目に値するのはこの Mozillaの記事 だけがFORMタグに言及していることです。同時に、一部のセキュリティスキャナはINPUTタグ内でオートコンプリートを検索し、それが見つからない場合(たとえが親のFORMにであっても)文句を言います。この混乱のより詳細な分析はこちらに投稿されています: HTMLフォームのAUTOCOMPLETE = OFF属性についての混乱

5
kravietz

理想的ではありませんが、レンダリングするたびにテキストボックスのIDと名前を変更することができます。データを取得できるように、サーバー側でも追跡する必要があります。

これが機能するかどうかわからない、単なる考えでした。

3
Kieron
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");
        }
    }
}
2
Jack Tuck

もっと簡単な方法があると思います。ランダムな名前で(javascriptを使って)隠し入力を作成し、それにユーザ名を設定します。パスワードを入力して繰り返します。このようにして、バックエンドスクリプトは、オートコンプリートを暗闇の中で維持しながら、適切なフィールド名が何であるかを正確に認識します。

私はおそらく間違っていますが、それは単なるアイデアです。

2