タグボックス ドロップダウンを使用する Web アプリケーションを作成しました。これは、Chrome ブラウザ (バージョン 21.0.1180.89) を除くすべてのブラウザで正常に動作します。
input
フィールドと属性の両方がform
あるにもかかわらずautocomplete="off"
、Chrome はフィールドの以前のエントリのドロップダウン履歴を表示しようとし、タグボックス リストが消えてしまいます。
ベストアンサー1
ユーザー名(またはメールアドレス)とパスワードの自動補完を禁止する:
<input type="email" name="email"><!-- Can be type="text" -->
<input type="password" name="password" autocomplete="new-password">
フィールドの自動補完を禁止する (動作しない可能性があります):
<input type="text" name="field" autocomplete="nope">
説明:
autocomplete
<input>
があってもでは動作しますが、のようなランダムな文字列にautocomplete="off"
変更できます。off
nope
フィールドのオートコンプリートを無効にするその他の「解決策」(正しい方法ではありませんが、機能します):
1.
HTML:
<input type="password" id="some_id" autocomplete="new-password">
JS (オンロード):
(function() {
var some_id = document.getElementById('some_id');
some_id.type = 'text';
some_id.removeAttribute('autocomplete');
})();
またはjQueryを使用します:
$(document).ready(function() {
var some_id = $('#some_id');
some_id.prop('type', 'text');
some_id.removeAttr('autocomplete');
});
2.
HTML:
<form id="form"></form>
JS (オンロード):
(function() {
var input = document.createElement('INPUT');
input.type = 'text';
document.getElementById('form').appendChild(input);
})();
またはjQueryを使用します:
$(document).ready(function() {
$('<input>', {
type: 'text'
}).appendTo($('#form'));
});
jQuery を使用して複数のフィールドを追加するには:
function addField(label) {
var div = $('<div>');
var input = $('<input>', {
type: 'text'
});
if(label) {
var label = $('<label>', {
text: label
});
label.append(input);
div.append(label);
} else {
div.append(input);
}
div.appendTo($('#form'));
}
$(document).ready(function() {
addField();
addField('Field 1: ');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form"></form>
作品:
クローム: 49+
Firefox: 44以上