Chrome mengabaikan autocomplete = “off”

445

Saya telah membuat aplikasi web yang menggunakan drop-down tagbox. Ini berfungsi baik di semua browser kecuali browser Chrome (Versi 21.0.1180.89).

Terlepas dari kedua inputbidang DAN formbidang yang memiliki autocomplete="off"atribut, Chrome bersikeras menampilkan riwayat tarik turun entri sebelumnya untuk bidang tersebut, yang menghapus daftar tagbox.

Tuan Fett
sumber
10
Secara teknis pertanyaan ini ditanyakan sekitar 5 bulan sebelum yang dirujuk sebagai "Pertanyaan ini sudah memiliki jawaban di sini". Yang itu adalah duplikat yang muncul setelah yang ini.
user3071434

Jawaban:

318

MEMPERBARUI

Tampaknya sekarang Chrome mengabaikan atribut style="display: none;"atau style="visibility: hidden;.

Anda dapat mengubahnya menjadi sesuatu seperti:

<input style="opacity: 0;position: absolute;">
<input type="password" style="opacity: 0;position: absolute;">

Dalam pengalaman saya, Chrome hanya menyelesaikan yang pertama <input type="password">dan yang sebelumnya secara otomatis <input>. Jadi saya telah menambahkan:

<input style="display:none">
<input type="password" style="display:none">

Ke bagian atas <form>dan kasus itu diselesaikan.

Diogo Cid
sumber
54
ini tidak berfungsi lagi chrome 40 tidak bekerja solusi ini
user881703
8
Tidak hanya ini jelek, tetapi saya masih tidak dapat menemukan penjelasan untuk pertanyaan Mengapa ??
Augustin Riedinger
4
Tampaknya Chrome sekarang mengabaikannya jika tampilan: tidak ada yang digunakan, jadi saya memindahkan bidang keluar dari tampilan dengan posisi absolut ...
Christoph Leiter
2
display: none;akan menghilangkan elemen, tidak ada tentang autocomplete.
Sandun Perera
276

Cegah pelengkapan otomatis nama pengguna (atau email) dan kata sandi:

<input type="email" name="email"><!-- Can be type="text" -->
<input type="password" name="password" autocomplete="new-password">

Mencegah pelengkapan otomatis bidang ( mungkin tidak berfungsi ):

<input type="text" name="field" autocomplete="nope">

Penjelasan:

autocompletemasih berfungsi pada saat <input>memiliki autocomplete="off", tetapi Anda dapat mengubah offke string acak, seperti nope.


Lainnya "solusi" untuk menonaktifkan pelengkapan otomatis bidang (ini bukan cara yang tepat untuk melakukannya, tetapi berfungsi):

1.

HTML:

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

JS (membebani):

(function() {
    var some_id = document.getElementById('some_id');
    some_id.type = 'text';
    some_id.removeAttribute('autocomplete');
})();

atau menggunakan 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 (membebani):

(function() {
    var input = document.createElement('INPUT');
    input.type = 'text';
    document.getElementById('form').appendChild(input);
})();

atau menggunakan jQuery:

$(document).ready(function() {
    $('<input>', {
        type: 'text'
    }).appendTo($('#form'));
});

Untuk menambahkan lebih dari satu bidang menggunakan 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>


Bekerja di:

  • Chrome: 49+

  • Firefox: 44+

cava
sumber
Tidak ada kode, hanya bagaimana jawaban Anda benar-benar mencegah pelengkapan otomatis jika autocomplete = "" seharusnya hanya menerima boolean
Tallboy
autocomplete = "new-password" ketika ditugaskan ke bidang kata sandi, bekerja untuk saya di chrome. autocomplete = "off" pada formulir tidak.
Second2None
2
Yang paling penting (dan satu-satunya hal yang berhasil bagi saya) adalah memastikan ID dan properti Nama Anda pada bidang <input> Anda tidak mengandung "Nama Pengguna" atau "Kata Sandi". Ini secara efektif menghentikan semua autocomplete untuk saya di autocomplete = "off".
GONeale
new-passwordadalah tangkapan yang bagus untuk setiap input tersembunyi yang sebenarnya bukan kata sandi, terima kasih
antongorodezkiy
Lol autocomplete="nope"sebenarnya berfungsi untuk saya, kecuali saya menambahkannya ke kedua bidang formulir saya. Seperti saya bisa memilikinya di kedua lapangan dan kemudian yang lapangan tidak akan otomatis melengkapi, tetapi bidang lainnya masih akan otomatis melengkapi, tapi begitu aku meletakkannya di kedua bidang, keduanya mulai autocompleting lagi.
PrintlnParams
147

Tampaknya Chrome sekarang mengabaikan autocomplete="off"kecuali itu ada di <form autocomplete="off">tag.

es krim
sumber
Untuk Bereaksi gunakan 'autoComplete = off.'
zero_cool
Untuk penjelasan mengapa Chrome melakukan perubahan ini, lihat jawaban ini: stackoverflow.com/a/39689037/1766230 - Mereka memprioritaskan pengguna daripada pengembang.
Lukas
13
Jika Anda ingin memberikan alasan yang sah kepada tim Chrome untuk menggunakan autocomplete = "off", silakan lakukan di sini: bugs.chromium.org/p/chromium/issues/detail?id=587466
Chris
@Digggid Chrome 71 tidak mengabaikan atribut, tetapi dalam beberapa kasus mengabaikan nilai "off". Menggunakan nilai seperti "negara" masih bekerja untuk saya.
Burak
1
Hanya klarifikasi di atas karena ada laporan yang saling bertentangan. Pada formulir, tambahkan autocomplete = "off" dan pada masing-masing tag input tambahkan autocomplete = "new-password". Bekerja pada Chrome 75
AndyP9
83

Pendekatan Modern

Cukup masukan Anda readonly, dan pada fokus, hapus saja. Ini adalah pendekatan yang sangat sederhana dan browser tidak akan mengisi readonlyinput. Oleh karena itu, metode ini diterima dan tidak akan pernah ditimpa oleh pembaruan peramban di masa mendatang.

<input type="text" onfocus="this.removeAttribute('readonly');" readonly />

Bagian selanjutnya adalah opsional. Gaya input Anda sesuai sehingga tidak terlihat seperti readonlyinput.

input[readonly] {
     cursor: text;
     background-color: #fff;
}

CONTOH KERJA

Fizzix
sumber
50
@ Basit - Dan itulah mengapa saya menyebutnya a modern approach. Kurang dari 1% pengguna di dunia mematikan Javascript. Jadi sejujurnya, tidak ada gunanya bagi siapa pun untuk mengakomodasi audiens sekecil ini ketika sebagian besar situs web mengandalkan Javascript. Telah mengembangkan situs web untuk waktu yang sangat lama sekarang, dan 100% situs saya menggunakan Javascript dan sangat bergantung padanya. Jika pengguna menonaktifkan Javascript, itu masalah dan pilihan mereka sendiri, bukan milik saya. Mereka tidak akan dapat mengunjungi atau menggunakan setidaknya 90% situs web secara online dengan itu dimatikan ... Downvote Anda sama sekali tidak relevan.
Fizzix
19
Ini tidak berfungsi hari ini di 49. "Pengembang" Chrome sedang menonton solusi stackoverflow dan menghapusnya.
puchu
7
Jawaban dari September 2015 ini pada dasarnya adalah salinan dari jawaban pada November 2014 di bawah.
dsuess
5
2019 - tidak berfungsi
user2060451
1
Ini akan mematahkan pembaca layar
Greg
80

Untuk solusi yang andal, Anda dapat menambahkan kode ini ke halaman tata letak Anda:

<div style="display: none;">
 <input type="text" id="PreventChromeAutocomplete" 
  name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>

Chrome menghormati autocomplete = off hanya ketika ada setidaknya satu elemen input lain dalam formulir dengan nilai autocomplete lainnya.

Ini tidak akan berfungsi dengan bidang kata sandi - yang ditangani dengan sangat berbeda di Chrome. Lihat https://code.google.com/p/chromium/issues/detail?id=468153 untuk detail lebih lanjut.

PEMBARUAN: Bug ditutup sebagai "Tidak Akan Diperbaiki" oleh Tim Chromium 11 Maret 2016. Lihat komentar terakhir dalam laporan bug yang awalnya diajukan , untuk penjelasan lengkap. TL; DR: gunakan atribut pelengkapan otomatis semantik seperti autocomplete = "new-street-address" untuk menghindari Chrome melakukan pengisian otomatis.

JT Taylor
sumber
2
@ Jonathan Cowley-Thom: coba halaman pengujian ini yang saya pasang berisi solusi saya. Di hub.securevideo.com/Support/AutocompleteOn , Anda akan melihat saran Chrome autocomplete. Kemudian, coba entri yang sama di hub.securevideo.com/Support/AutocompleteOff . Anda seharusnya tidak melihat saran pelengkapan otomatis Chrome. Saya baru saja menguji ini di Chrome 45.0.2454.101m dan 46.0.2490.71m, dan itu berfungsi seperti yang diharapkan pada keduanya.
JT Taylor
Satu lagi pembaruan tentang masalah ini: Saya baru saja menerima pemberitahuan dari tim Chrome bahwa ini telah diperbaiki. Jadi, semoga solusi ini tidak lama lagi tidak diperlukan lagi!
JT Taylor
Lihat posting saya di atas: "Ini tidak akan berfungsi dengan bidang kata sandi - yang ditangani dengan sangat berbeda di Chrome. Lihat code.google.com/p/chromium/issues/detail?id=468153 untuk detail lebih lanjut."
JT Taylor
46

Yah, agak terlambat ke pesta, tetapi tampaknya ada sedikit kesalahpahaman tentang bagaimana autocompleteseharusnya dan tidak seharusnya bekerja. Menurut spesifikasi HTML, agen pengguna (dalam hal ini Chrome) dapat mengganti autocomplete:

https://www.w3.org/TR/html5/forms.html#autofilling-form-controls:-the-autocomplete-attribute

Agen pengguna dapat mengizinkan pengguna untuk menimpa nama bidang isi ulang elemen elemen, misalnya untuk mengubahnya dari "off" ke "on" untuk memungkinkan nilai diingat dan diawali meskipun ada keberatan dari penulis halaman, atau untuk selalu "off", tidak pernah mengingat nilai-nilai. Namun, agen pengguna tidak boleh mengizinkan pengguna untuk secara sepele menimpa nama isian isian dari "off" menjadi "on" atau nilai-nilai lainnya, karena ada implikasi keamanan yang signifikan bagi pengguna jika semua nilai selalu diingat, terlepas dari preferensi situs.

Jadi dalam kasus Chrome, para pengembang pada dasarnya mengatakan "kami akan menyerahkan ini kepada pengguna untuk memutuskan dalam preferensi mereka apakah mereka mau autocomplete bekerja atau tidak. Jika Anda tidak menginginkannya, jangan aktifkan di browser Anda" .

Namun, tampaknya ini sedikit terlalu bersemangat pada bagian mereka untuk seleraku, tetapi memang begitulah adanya. Spesifikasi tersebut juga membahas implikasi keamanan potensial dari langkah tersebut:

Kata kunci "tidak aktif" menunjukkan bahwa data input kontrol sangat sensitif (misalnya kode aktivasi untuk senjata nuklir); atau bahwa itu adalah nilai yang tidak akan pernah digunakan kembali (misalnya kunci satu kali untuk login bank) dan oleh karena itu pengguna harus secara eksplisit memasukkan data setiap kali, alih-alih dapat mengandalkan UA untuk memilih nilai untuknya; atau bahwa dokumen tersebut menyediakan mekanisme pelengkapan otomatis sendiri dan tidak ingin agen pengguna memberikan nilai pelengkapan otomatis.

Jadi setelah mengalami frustrasi yang sama seperti orang lain, saya menemukan solusi yang cocok untuk saya. Ini serupa dalam nada denganautocomplete="false" jawaban.

Artikel Mozilla berbicara persis tentang masalah ini:

https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion

Dalam beberapa kasus, browser akan terus menyarankan nilai pelengkapan otomatis meskipun atribut pelengkapan otomatis disetel ke mati. Perilaku tak terduga ini bisa sangat membingungkan bagi pengembang. Trik untuk benar-benar memaksa penyelesaian tidak adalah dengan menetapkan string acak ke atribut

Jadi kode berikut harus berfungsi:

autocomplete="nope"

Dan seharusnya masing-masing dari berikut ini:

autocomplete="false"
autocomplete="foo"
autocomplete="bar"

Masalah yang saya lihat adalah bahwa agen peramban mungkin cukup pintar untuk mempelajari autocompleteatribut dan menerapkannya saat berikutnya ia melihat formulir. Jika memang melakukan ini, satu - satunya cara saya bisa melihat untuk tetap menyelesaikan masalah adalah dengan mengubah secara dinamisautocomplete atribut ketika halaman dihasilkan.

Satu hal yang layak disebutkan adalah bahwa banyak browser akan mengabaikan autocompletepengaturan untuk bidang login (nama pengguna dan kata sandi). Seperti yang dinyatakan dalam artikel Mozilla:

Untuk alasan ini, banyak browser modern tidak mendukung autocomplete = "off" untuk bidang login.

  • Jika suatu situs menyetel pelengkapan otomatis = "off" untuk suatu formulir, dan formulir tersebut menyertakan bidang input nama pengguna dan kata sandi, maka browser akan tetap menawarkan untuk mengingat login ini, dan jika pengguna setuju, browser akan mengisi ulang bidang tersebut secara otomatis saat berikutnya pengguna mengunjungi halaman ini.
  • Jika sebuah situs menetapkan autocomplete = "off" untuk bidang input nama pengguna dan kata sandi, maka browser akan tetap menawarkan untuk mengingat login ini, dan jika pengguna setuju, browser akan mengisi secara otomatis bidang tersebut saat berikutnya pengguna mengunjungi halaman ini.

Ini adalah perilaku di Firefox (sejak versi 38), Google Chrome (sejak 34), dan Internet Explorer (sejak versi 11).

Akhirnya sedikit info tentang apakah atribut tersebut berada pada formelemen atau inputelemen. Spek lagi memiliki jawaban:

Jika atribut autocomplete dihilangkan, nilai default yang sesuai dengan keadaan atribut autocomplete pemilik form digunakan sebagai gantinya (baik "on" atau "off"). Jika tidak ada pemilik formulir, maka nilai "on" digunakan.

Begitu. Meletakkannya di formulir harus berlaku untuk semua bidang input. Meletakkannya di elemen individu harus berlaku untuk elemen itu saja (bahkan jika tidak ada satu di formulir). Jika autocompletetidak disetel sama sekali, defaultnya adalah on.

Ringkasan

Untuk menonaktifkan autocompleteseluruh formulir:

<form autocomplete="off" ...>

Atau jika Anda perlu melakukannya secara dinamis:

<form autocomplete="random-string" ...>

Untuk menonaktifkan autocompleteelemen individual (terlepas dari pengaturan formulir yang ada atau tidak)

<input autocomplete="off" ...>

Atau jika Anda perlu melakukannya secara dinamis:

<input autocomplete="random-string" ...>

Dan ingat bahwa agen pengguna tertentu dapat mengesampingkan bahkan upaya paling sulit Anda untuk menonaktifkan autocomplete.

Hooligancat
sumber
1
2019 - tidak berfungsi Versi 76.0
user2060451
1
@ user2060451 - apa yang tidak berfungsi? Saya baru saja mengujinya di 76.0.3809.87 pada Windows dan Mac. - Keduanya bekerja sesuai spesifikasi. seperti dijelaskan di atas. Jika Anda bisa memberikan sedikit deskripsi lebih banyak daripada "tidak bekerja" saya mungkin bisa membantu Anda.
Hooligancat
1
Saya hanya mencoba memberikan (dari konsol setelah semuanya dimuat dan di set di sisi server) string acak untuk autocomplete dari elemen input, itu tidak berfungsi. Memberi autocomplete = "off" untuk membentuk elemen juga tidak berhasil.
Nuryagdy Mustapayev
29

Chrome versi 34 sekarang mengabaikan autocomplete=off, lihat ini .

Banyak diskusi tentang apakah ini hal yang baik atau buruk? Apa pandanganmu?

Peter Kerr
sumber
7
maaf untuk downvote ... ini bukan situs diskusi (coba quora saja), dan Anda tidak memberikan jawaban. Terima kasih untuk tautannya.
commonpike
25

Browser tidak peduli tentang pelengkapan otomatis = mati otomatis atau bahkan mengisi kredensial ke bidang teks yang salah?

Saya memperbaikinya dengan menyetel bidang kata sandi menjadi hanya-baca dan mengaktifkannya, ketika pengguna mengkliknya atau menggunakan tombol-tab untuk bidang ini.

perbaiki IsiOtomatis browser di: hanya baca dan atur writeble pada fokus (saat klik mouse dan tab bidang)

 <input type="password" readonly  
     onfocus="$(this).removeAttr('readonly');"/>

Pembaruan: Mobile Safari menetapkan kursor di lapangan, tetapi tidak menampilkan keyboard virtual. Perbaikan baru berfungsi seperti sebelumnya tetapi menangani keyboard virtual:

<input id="email" readonly type="email" onfocus="if (this.hasAttribute('readonly')) {
    this.removeAttribute('readonly');
    // fix for mobile safari to show virtual keyboard
    this.blur();    this.focus();  }" />

Demo Langsung https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

Omong-omong, informasi lebih lanjut tentang pengamatan saya:

Terkadang saya melihat perilaku aneh ini di Chrome dan Safari, ketika ada bidang kata sandi dalam bentuk yang sama. Saya kira, browser mencari bidang kata sandi untuk memasukkan kredensial Anda yang disimpan. Kemudian ia mengisi nama pengguna ke dalam bidang input-teks terdekat, yang muncul sebelum bidang kata sandi di DOM (hanya menebak karena pengamatan). Karena browser adalah instance terakhir dan Anda tidak dapat mengontrolnya, terkadang bahkan autocomplete = off tidak akan mencegah untuk mengisi kredensial ke bidang yang salah, tetapi bukan bidang pengguna atau nama panggilan.

dsuess
sumber
2
daripada menggunakan onfocus, saya menggunakan setTimeout untuk menghapus hanya baca, jadi pengguna saya tidak melihat input hanya dibaca dan tidak pernah fokus!
Hippyjim
23

Kamu bisa menggunakan autocomplete="new-password"

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

Bekerja di:

  • Chrome: 53, 54, 55
  • Firefox: 48, 49, 50
Steffi
sumber
Ini tidak dapat berfungsi, karena string pelengkapan otomatis diperbaiki. Browser akan mengingat kata sandi baru untuk waktu berikutnya.
langkah
23

TL; DR: Beri tahu Chrome bahwa ini adalah input kata sandi baru dan tidak akan memberikan yang lama sebagai saran pelengkapan otomatis:

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

autocomplete="off" tidak berfungsi karena keputusan desain - banyak penelitian menunjukkan bahwa pengguna memiliki lebih lama dan lebih sulit untuk meretas kata sandi jika mereka dapat menyimpannya di browser atau pengelola kata sandi.

Spesifikasi untuk autocomplete telah berubah , dan sekarang mendukung berbagai nilai untuk mempermudah pengisian formulir masuk:

<!-- Auto fills with the username for the site, even though it's email format -->
<input type="email" name="email" autocomplete="username">

<!-- current-password will populate for the matched username input  -->
<input type="password" autocomplete="current-password" />

Jika Anda tidak memberikan ini, Chrome masih mencoba menebak, dan ketika itu diabaikan autocomplete="off".

Solusinya adalah bahwa autocompletenilai - nilai juga ada untuk formulir reset kata sandi:

<label>Enter your old password:
    <input type="password" autocomplete="current-password" name="pass-old" />
</label>
<label>Enter your new password:
    <input type="password" autocomplete="new-password" name="pass-new" />
</label>
<label>Please repeat it to be sure:
    <input type="password" autocomplete="new-password" name="pass-repeat" />
</label>

Anda dapat menggunakan autocomplete="new-password"bendera ini untuk memberi tahu Chrome agar tidak menebak kata sandi, meskipun itu telah disimpan untuk situs ini.

Chrome juga dapat mengelola kata sandi untuk situs secara langsung menggunakan API kredensial , yang merupakan standar dan mungkin akan memiliki dukungan universal pada akhirnya.

Keith
sumber
5
Bukan alasan yang meyakinkan. Fakta bahwa pengguna menginginkan sesuatu tidak berarti itu ide yang cerdas. Itu hampir seburuk mengatakan Anda akan mengizinkan kata sandi karakter tunggal dalam aplikasi Anda karena pengguna merasa lebih nyaman. Kadang-kadang, keamanan mengalahkan kenyamanan ...
Daniel Kotin
Saya memiliki bidang yang disebut "ContactNoAlt" yang Chrome tegaskan untuk diisi dengan EmailAddress. Aktifkan / nonaktifkan Pelengkapan Otomatis lebih disukai tetapi penyelesaian diperlukan pada tingkat praktis karena Chrome goyah. Lebih lengkapnya autocomplete = "off" adalah standar - jadi apa yang membuat pengembang Chrome begitu baik sehingga mereka hanya merasa mereka dapat mengabaikan standar - mungkin suatu hari Chrome akan memutuskan bahwa beberapa bagian lain dari HTML tidak nyaman .... (ini mulai merasa seperti IE5 / 6 de-ja-vu)
dunxz
Saya pengguna chrome, dan saya tidak ingin perilaku ini. Bahkan tidak bertanya kepada saya sebelum mengisi ulang kotak kata sandi yang muncul untuk memastikan hanya saya yang bisa mengakses aplikasi web yang bersangkutan. Menyimpan beberapa kata sandi seharusnya tidak berarti melengkapi semua kata sandi secara otomatis .
Hippyjim
3
Jawaban ini (dan perilaku Google) mengabaikan fakta bahwa salah satu alasan utama Anda mungkin ingin melakukan ini adalah untuk menerapkan perilaku pelengkapan otomatis Anda sendiri (misalnya, daftar dari basis data).
squarelogic.hayden
Anda mencoba membela keputusan yang jelas buruk yang dibuat oleh chrome. Saya menerapkan kebijakan perusahaan yang tidak dapat saya ubah. Jadi sekarang saya harus memasukkan retasan untuk chrome. Mereka saat ini bekerja. Jika mereka berhenti bekerja maka perusahaan kami akan mengubah browser default untuk karyawan. Jadi sekarang kita memiliki perilaku yang sama tetapi dengan peretasan dan kemungkinan halaman yang rusak dalam peningkatan di masa mendatang. Dan melihat semua jawaban ini di sini ada banyak pengembang menggunakan peretas ini. Chrome yang dikerjakan dengan baik.
Claudiu Creanga
23

Saya telah memecahkan pertarungan tanpa akhir dengan Google Chrome dengan menggunakan karakter acak. Saat Anda selalu membuat pelengkapan otomatis dengan string acak, itu tidak akan pernah mengingat apa pun.

<input name="name" type="text" autocomplete="rutjfkde">

Semoga itu akan membantu orang lain.

langkah
sumber
12

Autocomplete="Off" tidak bekerja lagi.

Coba gunakan hanya string acak, bukan "Off", misalnyaAutocomplete="NoAutocomplete"

Saya harap ini membantu.

marco burrometo
sumber
5
Tidak berfungsi di Chrome 73
just_user
10

Terlihat chrome mengabaikannya autocomplete="off", saya menyelesaikannya dengan cara bodoh yang menggunakan "input palsu" untuk menipu chrome untuk mengisinya alih-alih mengisi yang "asli".

Contoh:

<input type="text" name="username" style="display:none" value="fake input" /> 
<input type="text" name="username" value="real input"/>

Chrome akan mengisi "input palsu", dan ketika mengirimkan, server akan mengambil nilai "input nyata".

Chang
sumber
10

Saya memposting jawaban ini untuk membawa solusi yang diperbarui untuk masalah ini. Saat ini saya menggunakan Chrome 49 dan tidak ada jawaban yang berhasil untuk yang satu ini. Saya juga mencari solusi yang bekerja dengan browser lain dan versi sebelumnya.

Letakkan kode ini di awal formulir Anda

<div style="display: none;">
    <input type="text" autocomplete="new-password">
    <input type="password" autocomplete="new-password">
</div>

Kemudian, untuk bidang kata sandi asli Anda, gunakan

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

Komentari jawaban ini jika ini tidak lagi berfungsi atau jika Anda mendapatkan masalah dengan browser atau versi lain.

Disetujui pada:

  • Chrome: 49
  • Firefox: 44, 45
  • Tepi: 25
  • Internet Explorer: 11
Loenix
sumber
1
Sayangnya, Chrome versi 49.0.2623.87 dan tidak berfungsi untuk TextBox, saya masih melihat popup autocomplete.
eYe
8

kepada siapa pun yang mencari solusi untuk ini, saya akhirnya mengetahuinya.

Chrome hanya mematuhi autocomplete = "off" jika halaman tersebut adalah halaman HTML5 (saya menggunakan XHTML).

Saya mengonversi halaman saya ke HTML5 dan masalahnya hilang (facepalm).

Tuan Fett
sumber
6

Ubah atribut tipe input menjadi type="search".

Google tidak menerapkan pengisian otomatis pada input dengan jenis pencarian.

Matas Vaitkevicius
sumber
1
Saya akan menurunkan suara: diuji pada chrome 60: ini tidak mencegah pelengkapan otomatis ..
boly38
6

Hingga minggu lalu, dua solusi di bawah ini tampaknya berfungsi untuk Chrome, IE dan Firefox. Tetapi dengan rilis Chrome versi 48 (dan masih di 49), mereka tidak lagi berfungsi:

  1. Berikut ini di bagian atas formulir:
<input style="display:none" type="text" name="fakeUsername"/>
<input style="display:none" type="password" name="fakePassword"/>
  1. Berikut ini di elemen input kata sandi:

    autocomplete = "off"

Jadi untuk memperbaikinya dengan cepat, pada awalnya saya mencoba menggunakan hack besar yang awalnya mengatur elemen input kata sandi untuk dinonaktifkan dan kemudian menggunakan setTimeout dalam fungsi siap dokumen untuk mengaktifkannya kembali.

setTimeout(function(){$('#PasswordData').prop('disabled', false);}, 50);

Tetapi ini tampak sangat gila dan saya melakukan pencarian lagi dan menemukan jawaban @tibalts di Menonaktifkan IsiOtomatis Chrome . Jawabannya adalah dengan menggunakan autocomplete = "new-password" pada input kata sandi dan ini tampaknya berfungsi pada semua browser (saya telah menyimpan nomor 1 perbaikan saya di atas pada tahap ini).

Berikut ini tautan dalam diskusi pengembang Google Chrome: https://code.google.com/p/chromium/issues/detail?id=370363#c7

prajna
sumber
@JorgeSampayo Hanya bekerja pada input kata sandi tetapi tidak pada input teks.
eYe
6

autocomplete=off sebagian besar diabaikan di peramban modern - terutama karena pengelola kata sandi, dll.

Anda dapat mencoba menambahkan ini autocomplete="new-password"tidak sepenuhnya didukung oleh semua browser, tetapi berfungsi pada beberapa

Mahdi Afzal
sumber
6

autocomplete="off"biasanya bekerja, tetapi tidak selalu. Itu tergantung pada namebidang input. Nama-nama seperti "alamat", 'email', 'nama' - akan dilengkapi secara otomatis (browser berpikir mereka membantu pengguna), ketika bidang seperti "kode", "pin" - tidak akan dilengkapi secara otomatis (jika autocomplete="off"disetel)

Masalah saya adalah - autocomplete mengacaukan bantuan alamat google

Saya memperbaikinya dengan mengubah nama itu

dari

<input type="text" name="address" autocomplete="off">

untuk

<input type="text" name="the_address" autocomplete="off">

Diuji dalam chrome 71.

Yevgeniy Afanasyev
sumber
1
Saya pikir ini adalah cara terbaru untuk menghapus lengkapi otomatis. bekerja pada 2020 Mei di chrome 81
NIKHIL CM
5

Tidak ada petunjuk mengapa ini berhasil dalam kasus saya, tetapi pada chrome yang saya gunakan autocomplete="none"dan Chrome berhenti menyarankan alamat untuk bidang teks saya.

Chris Sprague
sumber
4

Pada Chrome 42, tidak ada solusi / peretasan di utas ini (mulai dari 2015-05-21T12:50:23+00:00) yang berfungsi untuk menonaktifkan pelengkapan otomatis untuk bidang individual atau seluruh formulir.

EDIT: Saya telah menemukan bahwa Anda sebenarnya hanya perlu memasukkan satu bidang email tiruan ke dalam formulir Anda (Anda dapat menyembunyikannya dengan display: none) sebelum bidang lainnya untuk mencegah pelengkapan otomatis. Saya berasumsi bahwa chrome menyimpan semacam tanda tangan formulir dengan setiap bidang isian yang dilengkapi otomatis dan termasuk bidang email lain merusak tanda tangan ini dan mencegah pengisian otomatis.

<form action="/login" method="post">
    <input type="email" name="fake_email" style="display:none" aria-hidden="true">
    <input type="email" name="email">
    <input type="password" name="password">
    <input type="submit">
</form>

Berita baiknya adalah karena "tanda tangan formulir" rusak oleh ini, tidak ada bidang yang dilengkapi secara otomatis, jadi tidak ada JS yang diperlukan untuk menghapus bidang palsu sebelum dikirim.

Jawaban lama:

Satu-satunya hal yang saya temukan masih dapat dilakukan adalah memasukkan dua bidang dummy jenis email dan kata sandi sebelum bidang nyata. Anda dapat mengaturnya display: noneuntuk menyembunyikannya (tidak cukup pintar untuk mengabaikan bidang itu):

<form action="/login" method="post">
    <input type="email" name="fake_email" style="display:none" aria-hidden="true">
    <input type="password" name="fake_password" style="display:none" aria-hidden="true">
    <input type="email" name="email">
    <input type="password" name="password">
    <input type="submit">
</form>

Sayangnya, bidang harus dalam formulir Anda (jika tidak, kedua set input diisi otomatis). Jadi, agar bidang palsu benar-benar diabaikan, Anda perlu beberapa JS untuk dijalankan pada formulir kirim untuk menghapusnya:

form.addEventListener('submit', function() {
    form.elements['fake_email'].value = '';
    form.elements['fake_password'].value = '';
});

Perhatikan dari atas bahwa membersihkan nilai dengan Javascript berfungsi untuk mengganti autocomplete. Jadi, jika kehilangan perilaku yang benar dengan JS dinonaktifkan dapat diterima, Anda dapat menyederhanakan semua ini dengan JS "autocomplete" untuk Chrome:

(function(document) {

    function polyfillAutocomplete(nodes) {

        for(var i = 0, length = nodes.length; i < length; i++) {

            if(nodes[i].getAttribute('autocomplete') === 'off') {

                nodes[i].value = '';
            }
        }
    }

    setTimeout(function() {

        polyfillAutocomplete(document.getElementsByTagName('input'));
        polyfillAutocomplete(document.getElementsByTagName('textarea'));

    }, 1);

})(window.document);
Bailey Parker
sumber
4

Saya memiliki masalah serupa di mana bidang input mengambil nama atau email. Saya menetapkan autocomplete = "off" tetapi Chrome masih memaksakan saran. Ternyata itu karena teks placeholder memiliki kata "nama" dan "email" di dalamnya.

Sebagai contoh

<input type="text" placeholder="name or email" autocomplete="off" />

Saya mengatasinya dengan menempatkan spasi nol lebar ke dalam kata-kata di placeholder. Tidak ada lagi pelengkapan otomatis Chrome.

<input type="text" placeholder="nam&#8203;e or emai&#8203;l" autocomplete="off" />
WDuffy
sumber
4

Di Chrome 48+ gunakan solusi ini:

  1. Letakkan bidang palsu sebelum bidang nyata:

    <form autocomplete="off">
      <input name="fake_email"    class="visually-hidden" type="text">
      <input name="fake_password" class="visually-hidden" type="password">
    
      <input autocomplete="off" name="email"    type="text">
      <input autocomplete="off" name="password" type="password">
    </form>
  2. Sembunyikan bidang palsu:

    .visually-hidden {
      margin: -1px;
      padding: 0;
      width: 1px;
      height: 1px;
      overflow: hidden;
      clip: rect(0 0 0 0);
      clip: rect(0, 0, 0, 0);
      position: absolute;
    }
  3. Anda berhasil!

Ini juga akan berfungsi untuk versi yang lebih lama.

yivo
sumber
@yivo Sepertinya satu-satunya perbedaan antara jawaban urs dan og adalah tag penting !, jadi saya menambahkannya, masih tidak berfungsi. dropbox.com/s/24yaz6ut7ygkoql/…
Mike Purcell
@MikePurcell Anda tidak memiliki autocomplete="off"pada formtag. Coba juga memasukkan input palsu segera setelah formtag.
yivo
@Yivo: Mencoba saran Anda, berfungsi dengan baik untuk bidang email, namun penguraian isi ulang otomatis masih terjadi untuk bidang kata sandi. dropbox.com/s/5pm5hjtx1s7eqt3/…
Mike Purcell
3

Setelah chrome v. 34, pengaturan autocomplete="off"pada <form>tag tidak berfungsi

Saya membuat perubahan untuk menghindari perilaku menjengkelkan ini:

  1. Hapus namedan iddari input kata sandi
  2. Masukan kelas pada input (ex .: passwordInput)

(Sejauh ini, Chrome tidak akan memasukkan kata sandi yang disimpan pada input, tetapi formulir sekarang rusak)

Akhirnya, untuk membuat form berfungsi, letakkan kode ini untuk dijalankan ketika pengguna mengklik tombol kirim, atau setiap kali Anda ingin memicu pengiriman formulir:

var sI = $(".passwordInput")[0];
$(sI).attr("id", "password");
$(sI).attr("name", "password");

Dalam kasus saya, saya biasa id="password" name="password"memasukkan input kata sandi, jadi saya mengembalikannya sebelum memicu pengiriman.

Renato Lochetti
sumber
3

Setelah mencoba semua solusi, Inilah yang tampaknya berfungsi untuk versi chrome: 45, dengan bidang isian kata sandi:

 jQuery('document').ready(function(){
        //For disabling Chrome Autocomplete
        jQuery( ":text" ).attr('autocomplete','pre'+Math.random(0,100000000));
 });
tidak manusiawi
sumber
3

Saya baru saja memperbarui ke Chrome 49 dan solusi Diogo Cid tidak berfungsi lagi.

Saya membuat solusi yang berbeda untuk menyembunyikan dan menghapus bidang pada saat run-time setelah halaman dimuat.

Chrome sekarang mengabaikan solusi awal yang menerapkan kredensial ke bidang yang pertama kali ditampilkan type="password" dan type="text"bidang sebelumnya , jadi saya telah menyembunyikan kedua bidang menggunakan CSS visibility: hidden;

<!-- HTML -->
<form>
    <!-- Fake fields -->
    <input class="chromeHack-autocomplete">
    <input type="password" class="chromeHack-autocomplete">

    <input type="text" placeholder="e-mail" autocomplete="off" />
    <input type="password" placeholder="Password" autocomplete="off" />
</form>

<!-- CSS -->
.chromeHack-autocomplete {
    height: 0px !important;
    width: 0px !important;
    opacity: 0 !important;
    padding: 0 !important; margin: 0 !important;
}

<!--JavaScript (jQuery) -->
jQuery(window).load(function() {
    $(".chromeHack-autocomplete").delay(100).hide(0, function() {
        $(this).remove();
    });
});

Saya tahu bahwa itu mungkin tampak tidak terlalu elegan tetapi berhasil.

Cliff Burton
sumber
2

saya menemukan solusi ini menjadi yang paling tepat:

function clearChromeAutocomplete()
{
// not possible, let's try: 
if (navigator.userAgent.toLowerCase().indexOf('chrome') >= 0) 
{
document.getElementById('adminForm').setAttribute('autocomplete', 'off'); 
setTimeout(function () {
        document.getElementById('adminForm').setAttribute('autocomplete', 'on'); 
}, 1500);
}
}

Itu harus dimuat setelah dom siap, atau setelah formulir merender.

pengguna2241415
sumber
2

Sementara saya setuju pelengkapan otomatis harus menjadi pilihan pengguna, ada kalanya Chrome terlalu bersemangat dengannya (peramban lain juga mungkin). Misalnya, bidang kata sandi dengan nama yang berbeda masih diisi secara otomatis dengan kata sandi yang disimpan dan bidang sebelumnya diisi dengan nama pengguna. Ini terutama menyebalkan ketika formulir tersebut adalah formulir manajemen pengguna untuk aplikasi web dan Anda tidak ingin pengisian otomatis diisi dengan kredensial Anda sendiri.

Chrome sepenuhnya mengabaikan pelengkapan otomatis = "mati" sekarang. Sementara peretasan JS mungkin berhasil, saya menemukan cara sederhana yang bekerja pada saat penulisan:

Setel nilai bidang kata sandi ke karakter kontrol 8 ( "\x08"dalam PHP atau&#8; HTML). Ini menghentikan Chrome mengisi bidang secara otomatis karena memiliki nilai, tetapi tidak ada nilai aktual yang dimasukkan karena ini adalah karakter backspace.

Ya ini masih merupakan peretasan, tetapi berhasil bagi saya. YMMV.

spikyjt
sumber
Tampaknya tidak berfungsi di Chrome 40
kap
Saya pikir mereka telah mengambil hack ini dan mengabaikan karakter kontrol dalam nilai, jadi sekarang dinilai kosong. Lihat jawabannya oleh @ ice-cream stackoverflow.com/a/16130452/752696 untuk solusi yang tepat dan terkini.
spikyjt
Kasus penggunaan yang sama di sini: Bekerja dengan manajemen pengguna dan memiliki kredensial sendiri yang diisi otomatis. Namun karena ini adalah kode saya sendiri dan saya menggunakan kembali formuntuk membuat pengguna baru dan mengedit yang ada hanya mengesampingkan inputnilai-nilai melalui JS menghapus lengkapi-otomatis.
nuala