37

autocomplete="off"私が求めているものではありません。基本的に、私の登録フォームには、「電話」と「パスワード」のフィールドが上下に配置されています。（スクリーンショットを参照）

ブラウザが何をしているのかを推測すると、「電話」フィールドにはユーザー名が事前に入力されています。ブラウザはパスワードタイプのフィールドを見つけ、ユーザー名フィールドの直前にテキスト入力フィールドを想定します。効果は次のとおりです。

登録フォームのスナップショット

電話フィールドの非標準のオートコンプリート属性に興味がないのは、ユーザーがこのフォームにできるだけ簡単に入力できるようにし、他のサイトで以前に電話番号を入力したことがある場合（ 「電話」）フィールドに入力し始めると、これが表示されることでメリットが得られます。そのため、オートコンプリートを完全にオフにしたくありません。

この振る舞いを避けるために、どういうわけかフィールドを再編成する方向にもっと考えていました。または、パスワードフィールドの上のフィールドがそれとは関係がないこと、またはパスワードフィールドが認証目的で使用されていないことをブラウザに通知する方法。どういうわけかそれをマークします。または、これら2つのフィールドの間に目に見えない要素を挿入しますか？

何か案は？

使用したマークアップ：

<input id="phone" name="phone" type="text" value="" maxlength="30">
<input id="newPassword" name="newPassword" type="password" value="" maxlength="20">

私はChrome、FFでこの動作をしています（IEについてはよくわかりませんが、私のマシンではその古風なバージョンを入手しました。まだIEについて心配し始めたくありません）。

4

4 に答える 4

31

ほとんどのパスワードマネージャーは、最初のパスワードフィールドと、その前にある最も近いテキストフィールドを検索します。

display:noneしたがって、あなたがしなければならないのは、 「新しいパスワード」の上に非表示のテキストとパスワードフィールド（）を追加することだけです。

Firefoxは、3つのパスワードフィールドを「パスワードの変更」アクションとして解釈しようとします。したがって、それを望まない場合は、さらに別の非表示のパスワードフィールドを安全に追加する必要があります。

于 2012-03-13T23:45:17.847 に答える
15

setpasswordフィールドでも同様の問題が発生しました。試す

<input type="password" autocomplete="new-password">

MDN入力ドキュメントから：

オートコンプリート

この属性は、コントロールの値がブラウザーによって自動的に完了できるかどうかを示します。

可能な値は次のとおりです。

.... new-password：新しいパスワード（アカウントの作成時やパスワードの変更時など）

電話番号の問題については、これを設定すると、そこでユーザー名の自動入力が停止しました。

<input type="tel">
于 2016-02-04T06:21:16.883 に答える
2

ホーム番号を30文字にすることはできません。これが、サイズが原因でブラウザがユーザー名またはログイン用メールである可能性があると想定している理由です。それを実際のものに変更して、何が起こるかを見てください。

また、電話番号、市外局番、プレフィックス、サフィックスの3つのフィールドを用意することを検討してください。特定の桁数が入力されると、JavaScriptを使用して次の電話セグメントフィールドにオートフォーカスできるため、ユーザーにとって使いやすくなります。

フィールドの位置も変えてみましたか？何が起こったか？

また、念のため、ログインフィールドでもオフにしない限り、ログイン中にオフになることを心配せずに、登録中に特定のアイテムのオートコンプリートをオフにすることができます（もちろん、オフになりません）。する必要はありません。

また、未使用の保存済みフォームのオートコンプリートを削除します。バージョンのローカルな問題である可能性があります。ある日、一方のブラウザに不正な値を入力してから、もう一方のブラウザ（chromeまたはFF）をインストールした可能性があります。次に、新しくインストールされたブラウザが元のブラウザからのルールとまったく同じようにルールをコピーしました。したがって、1つの不正なエントリと、2番目にインストールされたブラウザがコピーして複製したために、フォームのグローバルな問題であると考えることになります。あなたの最初のブラウザからの悪いエントリルール、それはあなたにとって本当の、普遍的な問題のように見えます、私をつかまえますか？したがって、ブラウザのInPrivateモードを試すか、別のインストールまたは別のコンピュータ、あるいはお持ちのvirtualpcインスタンスからブラウザを試してください。

それ以外の場合は、ブラウザからすべての設定をエクスポートして両方のブラウザをアンインストールし、FFとChromeを最初から再インストールしてから、Webページをテストしてから、エクスポートした設定を自由にインポートして戻します。

また、それがあなたに与えるかもしれない洞察のためであっても、IEでテストしてください、私が何を意味するか知っていますか？

これがお役に立てば幸いです。どのように乗り込むか、他にご不明な点がありましたらお知らせください。

アップデート：

選択した方法を考えると、電話フィールドをレンダリングするときに、JavaScriptを使用する代わりに、入力タグにvalue=""属性を追加することができるはずです。これにより、javascriptを使用せずに事前入力が行われないようにする必要があります。ここで、さらに一歩進んだ場合は、次のようにすることができます。

ページが読み込まれるときのOnLoadイベント中に、JavaScriptを使用して電話フィールドを確認し、値が1スペース（ ""）に等しい場合は、onLoadがトリガーされたら、JavaScriptを使用して空の文字列で上書きします。または、ブラウザがまだ事前入力されている場合（そうなるとは思えませんが）、このチェックを数百ミリ秒遅らせて、ページが読み込まれてから数百ミリ秒後にjavascriptを実行するか、ページの全部または一部に関連付けることができます。入力フィールドはonFocusイベントであるため、いずれかのフィールドがフォーカスを取得するとすぐに、「phone.valueは1つのスペース文字（ "」に等しいか）を実行します。そうする場合は、空の文字列で上書きします。この状況では、ブラウザがジャンプしてそのフィールドをハイジャックすることはありません。前述のように、これをonLoadで実行しても、ブラウザがフィールドをハイジャックすることはないと思いますが、

どうなるか教えてください。

于 2012-03-12T19:28:01.473 に答える
1

DOMのロード後に入力フィールドtype=text＆type = passwordを無効にしてから、特定のミリ秒後にすべての無効なフィールドを有効にしてみました。たとえば、100としましょう。これでうまくいくようです。試す ：

$(document).ready(function()
{
$("input[type=text],input[type=password]").prop('disabled','disabled');

$("body").delay(10,function(){
    $("input[type=text],input[type=password]").prop('disabled','');
    });
});
于 2013-04-19T10:14:14.830 に答える