Bagaimana Anda menonaktifkan Pelengkapan otomatis peramban pada isian formulir web / tag input?


2793

Bagaimana Anda menonaktifkan autocompletebrowser utama untuk spesifik input(atau form field)?


2
Dalam beberapa sistem di mana penguji harus secara manual memasukkan banyak informasi berulang kali mungkin berguna untuk memiliki opsi yang dapat dikonfigurasi sehingga ketika pengujian Anda dapat menonaktifkannya dan cukup tekan 'tab> panah bawah> tab> panah bawah dll. . '
Simon_Weaver

Jawaban:


2625

Firefox 30 mengabaikan autocomplete="off"kata sandi, memilih untuk meminta pengguna, bukan apakah kata sandi harus disimpan pada klien. Perhatikan komentar berikut dari 5 Mei 2014:

  • Pengelola kata sandi selalu meminta jika ingin menyimpan kata sandi. Kata sandi tidak disimpan tanpa izin dari pengguna.
  • Kami adalah peramban ketiga yang menerapkan perubahan ini, setelah IE dan Chrome.

Menurut dokumentasi Jaringan Pengembang Mozilla , atribut elemen formulir Boolean autocompletemencegah data formulir dari di-cache di browser yang lebih lama.

<input type="text" name="foo" autocomplete="off" />

45
Ini tidak berhasil untuk saya di Firefox 3.0.3. Saya harus meletakkan atribut autocomplete di FORMULIR daripada INPUT.
Winston Fassett

17
Autocomplete hanya didefinisikan dalam standar HTML 5, sehingga akan memecah semua validasi yang Anda lakukan terhadap HTML 4. * ...
Jrgns

96
@ Winston, Anda harus meletakkan keduanya di formulir, DAN pada elemen input itu sendiri. Dengan cara itu Anda menutupi semua tidak standar browser.
AviD

83
Dan ingatlah untuk menonaktifkan ekstensi autocomplete = on (jika Anda menggunakan Chrome) sebelum menguji aplikasi web Anda. Jika tidak, Anda akan merasa konyol seperti saya. ;)
Jo Liss


314

Selain itu autocomplete=off, Anda juga bisa meminta nama bidang formulir Anda secara acak oleh kode yang menghasilkan halaman, mungkin dengan menambahkan beberapa string khusus sesi ke akhir nama.

Ketika formulir dikirimkan, Anda dapat menghapus bagian itu sebelum memprosesnya di sisi server. Ini akan mencegah browser web menemukan konteks untuk bidang Anda dan juga mungkin membantu mencegah serangan XSRF karena penyerang tidak akan bisa menebak nama bidang untuk pengiriman formulir.


10
Ini adalah solusi yang jauh lebih baik dibandingkan dengan menggunakan autocomplete = "off". Yang harus Anda lakukan adalah menghasilkan nama baru di setiap halaman memuat dan menyimpan nama itu ke $ _SESSION untuk digunakan di masa depan:$_SESSION['codefield_name'] = md5(uniqid('auth', true));
enchance

78
Tidak, ini bukan solusi yang lebih baik, karena asal preferensi untuk pengaturan ini adalah agen pengguna yang juga dikenal sebagai browser web. Ada perbedaan antara mendukung perilaku tertentu (yang coba dilakukan HTML 5) dan memaksanya dengan memutuskan atas nama pengguna, yang Anda sarankan adalah "solusi yang jauh lebih baik".
amn

15
Solusi ini dapat bekerja dengan semua browser, jadi dalam hal ini "lebih baik". Namun, amn benar, memutuskan untuk menonaktifkan pelengkapan otomatis atas nama pengguna Anda bukanlah ide yang baik. Ini berarti saya hanya akan menonaktifkan pelengkapan otomatis dalam situasi yang sangat spesifik, seperti ketika Anda berencana untuk membangun fungsionalitas pelengkapan otomatis Anda sendiri dan tidak ingin konflik atau perilaku aneh.
macguru2000

8
Mengenai serangan XSRF, saya tidak yakin jenis serangan apa yang Anda bayangkan, tetapi tidak bisakah penyerang melepaskan bagian ujungnya dengan cara yang sama seperti Anda melakukan sisi server untuk mengidentifikasi bidang? Atau jika penyerang memposting kolom, tidak bisakah mereka menambahkan string acak mereka sendiri karena itu akan dilepaskan oleh server?
xr280xr

9
@ macguru2000 membangun autocomplete Anda sendiri adalah kasus penggunaan yang sepenuhnya sah dan umum. Benar-benar peramban harus memudahkan pengembang untuk mematikan pelengkapan otomatis saat mereka perlu alih-alih memaksa kami menggunakan peretasan seperti ini
whoadave

235

Sebagian besar peramban dan pengelola kata sandi utama (dengan benar, IMHO) sekarang diabaikan autocomplete=off .

Mengapa? Banyak bank dan situs web "keamanan tinggi" lainnya ditambahkanautocomplete=off ke halaman login mereka "untuk tujuan keamanan" tetapi ini sebenarnya mengurangi keamanan karena membuat orang mengubah kata sandi di situs dengan keamanan tinggi ini menjadi mudah diingat (dan karenanya retak) karena pelengkapan otomatis rusak.

Dahulu kebanyakan pengelola kata sandi mulai mengabaikan autocomplete=off , dan sekarang peramban mulai melakukan hal yang sama hanya untuk input nama pengguna / kata sandi.

Sayangnya, bug dalam implementasi pelengkapan otomatis memasukkan info nama pengguna dan / atau kata sandi ke dalam bidang formulir yang tidak sesuai, menyebabkan kesalahan validasi formulir, atau lebih buruk lagi, secara tidak sengaja memasukkan nama pengguna ke dalam bidang yang sengaja dikosongkan oleh pengguna.

Apa yang harus dilakukan pengembang web?

  • Jika Anda dapat menyimpan sendiri semua bidang kata sandi pada suatu halaman, itu adalah awal yang bagus karena tampaknya keberadaan bidang kata sandi adalah pemicu utama bagi pengguna / pengguna autocomplete untuk memulai. Jika tidak, baca tips di bawah ini.
  • Safari memperhatikan bahwa ada 2 bidang kata sandi dan menonaktifkan pelengkapan otomatis dalam hal ini, dengan asumsi itu harus berupa perubahan kata sandi, bukan formulir login. Jadi pastikan untuk menggunakan 2 bidang kata sandi (baru dan konfirmasikan baru) untuk segala bentuk yang Anda izinkan
  • Chrome 34, sayangnya, akan mencoba mengisi ulang isian dengan pengguna / pass setiap kali melihat bidang kata sandi. Ini adalah bug yang cukup buruk yang diharapkan, mereka akan mengubah perilaku Safari. Namun, menambahkan ini ke bagian atas formulir Anda tampaknya menonaktifkan autofill kata sandi:

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

Saya belum menyelidiki IE atau Firefox secara menyeluruh tetapi akan dengan senang hati memperbarui jawabannya jika orang lain memiliki info di komentar.


5
apa yang Anda maksud dengan "menambahkan ini pada halaman Anda tampaknya menonaktifkan isi-otomatis untuk halaman:"
wutzebaer

5
@wutzebaer, Chrome memperhatikan bidang kata sandi tersembunyi dan menghentikan pelengkapan otomatis. Kabarnya ini untuk mencegah situs mencuri info kata sandi tanpa disadari pengguna.
David W

6
Cuplikan kode Anda mencegah pelengkapan otomatis untuk bidang info masuk di Chrome, Firefox, IE 8 dan IE 10. Tidak menguji IE 11. Hal-hal bagus! Hanya jawaban sederhana yang masih berfungsi.
Sam Watkins

3
Catatan safari Anda tampaknya berfungsi di Chrome juga, setidaknya pada Desember 2015. Saya memiliki bidang nama pengguna dan kata sandi pada formulir pendaftaran yang dilengkapi secara otomatis dengan data dari formulir masuk. Membuat dua type='password'bidang pada satu halaman menyebabkan "simpan kata sandi" peramban secara otomatis diabaikan, yang membuat seluruh perasaan masuk akal karena formulir pendaftaran cenderung meminta kata sandi dua kali ketika formulir login hanya meminta satu kali.
Matt Fletcher

3
Tampaknya tidak berfungsi lagi di Chrome 55, kecuali bidang kata sandi tambahan tidak disembunyikan, yang mengalahkan tujuannya.
jokkedk

160

Terkadang bahkan pelengkapan otomatis = mati tidak akan mencegah untuk mengisi kredensial ke bidang yang salah, tetapi bukan bidang pengguna atau nama panggilan.

Penanganan masalah ini merupakan tambahan untuk posting apinstein tentang perilaku browser.

perbaiki IsiOtomatis browser hanya-baca dan atur fokus yang dapat ditulis (klik dan tab)

 <input type="password" readonly  
     onfocus="this.removeAttribute('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

Karena Browser otomatis mengisi kredensial ke bidang teks yang salah !?

Saya perhatikan 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 secara otomatis mengisi (hanya menebak karena pengamatan) bidang input-teks terdekat, yang muncul sebelum bidang kata sandi di DOM. Karena browser adalah contoh terakhir dan Anda tidak dapat mengontrolnya,

Perbaikan baca-baca di atas ini berhasil untuk saya.


8
Jika tidak ada javascript maka seluruh formulir gagal. -1
Jimmy Kane

8
@JimmyKane kuncinya adalah untuk juga menambahkan atribut menggunakan javascript di tempat pertama (yang dsuess tidak dilakukan di sini, tetapi hanya menambahkan demi kelengkapan).
trnelson

@ tmelson Saya mengerti tetapi masih mengapa menggunakan js untuk menonaktifkan? Mari kita hindari js untuk hal-hal yang dapat ditingkatkan secara asli. Sekali lagi saya setuju dengan Anda.
Jimmy Kane

3
Ini tidak berfungsi dengan benar di IE8, bidang kata sandi yang hanya dibaca tidak dapat diedit saat pertama kali Anda memfokuskannya, hanya setelah Anda tidak fokus dan fokus lagi. Ide bagus, tapi sayangnya itu agak terlalu hacky dan tidak aman untuk digunakan.
Sam Watkins

Ini tidak berfungsi dengan benar di semua browser (mis. IE 11 & IE Edge). Segera setelah readonlydihapus, pemilihan bidang berikutnya akan mengembalikan otomatis.
Lewat Coding

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

Ini akan bekerja di Internet Explorer dan Mozilla FireFox, downside adalah bahwa itu bukan standar XHTML.


Saya perhatikan bahwa menambahkannya ke elemen formulir tidak selalu mencegah penerapannya pada input individual di dalam formulir. Oleh karena itu mungkin yang terbaik adalah menempatkannya pada elemen input secara langsung.
sholsinger

15
Sebenarnya @sholsinger, yang terbaik adalah meletakkannya di form, DAN pada elemen input itu sendiri. Dengan cara itu Anda menutupi semua tidak standar browser.
AviD

2
Sayangnya, pada IE 11, Microsoft tidak lagi menghargai ini input type="password". Semoga tidak ada browser lain yang memilih untuk menghapus fungsi ini.
SamHuckaby

Pengaturan autocomplete="off"pada formadalah satu-satunya hal yang berfungsi untuk Chrome.
Andrew

106

Solusi untuk Chrome adalah menambahkan autocomplete="new-password"kata sandi tipe input. Silakan periksa Contoh di bawah ini.

Contoh:

<form name="myForm"" method="post">
   <input name="user" type="text" />
   <input name="pass" type="password" autocomplete="new-password" />
   <input type="submit">
</form>

Chrome selalu melengkapi data secara otomatis jika menemukan kotak kata sandi jenis , cukup untuk menunjukkan kotak itu autocomplete = "new-password".

Ini bekerja dengan baik untuk saya.

Catatan: pastikan dengan F12perubahan yang Anda lakukan, berkali-kali browser menyimpan halaman dalam cache, ini memberi saya kesan buruk bahwa itu tidak berfungsi, tetapi browser sebenarnya tidak membawa perubahan.


2
Ini berfungsi di Chrome untuk jenis bidang lain juga, bukan hanya ketik = "kata sandi".
Jake

Saya menggunakannya dengan kata sandi, email dan jenis teks dan berhasil. Saya menggunakannya seperti ini: autocomplete = "new"
Crak_mboutin

autocomplete = "nope" name = "pswd" dan menggunakan <input name = "dummyPassword" type = "password" style = "display: none;"> sebelum bidang input kata sandi asli. Ini berhasil untuk saya.
Denuka


Ini berfungsi di hampir semua browser sekarang, bukan hanya Chrome: autocomplete # Browser_compatibility .
Andrew Morton

60

Seperti yang orang lain katakan, jawabannya adalah autocomplete="off"

Namun, saya pikir itu layak menyatakan mengapa itu ide yang baik untuk menggunakan ini dalam kasus-kasus tertentu karena beberapa jawaban untuk ini dan pertanyaan duplikat menyarankan lebih baik untuk tidak mematikannya.

Menghentikan browser yang menyimpan nomor kartu kredit tidak boleh diserahkan kepada pengguna. Terlalu banyak pengguna bahkan tidak menyadari itu masalah.

Sangat penting untuk mematikannya di bidang kode keamanan kartu kredit. Seperti yang dinyatakan halaman ini :

"Jangan pernah menyimpan kode keamanan ... nilainya tergantung pada anggapan bahwa satu-satunya cara untuk memasoknya adalah dengan membacanya dari kartu kredit fisik, membuktikan bahwa orang yang memasoknya benar-benar memegang kartu itu."

Masalahnya adalah, jika itu adalah komputer umum (warnet, perpustakaan, dll.) Maka mudah bagi pengguna lain untuk mencuri detail kartu Anda, dan bahkan pada komputer Anda sendiri situs web jahat dapat mencuri data yang dilengkapi secara otomatis .


7
jika saya pergi ke sebuah situs dan ingat kartu saya di dropdown saya akan sangat bahagia. Aku mulai bertanya-tanya bagaimana mereka bisa begitu ceroboh.
Simon_Weaver

9
Kasus yang jauh lebih sederhana / lebih kritis. Ketika saya mengunjungi halaman pengguna di bagian admin situs saya, ia mencoba untuk mengatur nama pengguna dan kata sandi mereka menjadi nama pengguna dan kata sandi admin saya, tidak dapat mengatakan bahwa ini bukan formulir login. Saya ingin agar kata sandi admin saya diingat, tetapi itu adalah kesalahan kritis yang mencoba menerapkan nama pengguna / kata sandi yang diingat itu kepada setiap pengguna yang kemudian saya edit.
rjmunro

34

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.


2
Ini bekerja lebih baik. Anda dapat menambahkan JS kecil yang menghasilkan kode acak untuk setiap pemuatan halaman, dan menambahkan kode itu ke bidang input: <code> function autoId () {var autoId = ""; var dict = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; untuk (var i = 0; i <12; i ++) {autoId + = dict.charAt (Math.floor (Math.random () * dict.length)); } kembalikan otomatis; } $ ('. autocompleteoff'). attr ('autocomplete', autoId ()); </code> Anda dapat menambahkan autocompleteoffkelas ke kolom input yang Anda inginkan.
Raghuram Kasyap

tidak berfungsi di Versi chrome saya 68.0.3440.106 (Pembuatan Resmi) (64-bit)
Sukanya Purushothaman

Chrome telah diperbaiki untuk menggunakan standar "tidak aktif" sekarang
MacK

1
Sayangnya itu bekerja lebih baik daripada apa yang disebut standar pada chrome
Nour Lababidi

1
Hari ini saya menemukan bahwa Chrome akan menimpa string acak dengan "Off". Saya tidak percaya bahwa pengembang Chrome melakukan atribut ini buruk dan tidak terkontrol. Kenapa ohh punya saya.
langkah

33

Saya harus memohon berbeda dengan jawaban yang mengatakan untuk menghindari penonaktifan pelengkapan otomatis.

Hal pertama yang muncul adalah pengisian-otomatis yang tidak dinonaktifkan secara eksplisit pada bidang formulir masuk adalah kegagalan PCI-DSS. Selain itu, jika mesin lokal pengguna dikompromikan, maka data autocomplete apa pun dapat diperoleh secara sepele oleh penyerang karena disimpan di tempat yang jelas.

Tentu saja ada argumen untuk kegunaan, namun ada keseimbangan yang sangat baik ketika datang ke bidang formulir mana yang harus dinonaktifkan autocomplete dan mana yang tidak.


Itu baru saja menjadi perhatian saya bahwa IE tidak memicu peristiwa onChange ketika Anda mengisi input teks menggunakan AutoComplete. Kami memiliki lusinan formulir dan lebih dari seribu peristiwa Perubahan (validasi input, logika bisnis) yang tersebar di seluruh formulir. Baru-baru ini kami memutakhirkan IE ke versi yang lebih baru dan tiba-tiba semua hal aneh mulai terjadi. Untungnya kami menjalankan aplikasi intranet dan pelengkapan otomatis bukan masalah UX bagi kami, lebih mudah untuk mematikannya saja.
Robotron

3
Jika pengguna mesin lokal dikompromikan, mereka kacau, titik. Bisa saja keylogger terinstal, itu bisa memiliki sertifikat root SSL palsu ditambahkan dan semua yang dikirim melalui proxy palsu dll. Saya punya alasan nyata untuk menonaktifkan autocomplete - Ketika saya login sebagai admin dan mengunjungi halaman edit pengguna, itu menetapkan pengguna itu nama pengguna dan kata sandi admin saya. Saya perlu mencegah perilaku ini.
rjmunro

1
Vendor peramban tampaknya mencari kepentingan mereka sendiri. Kata sandi tersimpan = penguncian pengguna. Dan pelengkapan otomatis on / off terlalu sederhana - mengapa bukan standar kompleks petunjuk semantik ( html.spec.whatwg.org/multipage/… ) yang, dengan cara, memungkinkan browser untuk mengumpulkan data semantik yang berharga dari masing-masing situs kunjungan pengguna?
aro_tech

kasus penggunaan spesifik yang saya coba selesaikan adalah ini: mereka sudah masuk. tetapi sekarang mereka akan mengakses sesuatu yang bahkan lebih sensitif. Saya ingin menunjukkan dialog yang membuat mereka mengautentikasi ulang, melawan kemungkinan mereka berjalan untuk merokok dan orang jahat duduk di kursi mereka. telah mencoba beberapa teknik untuk mengalahkan pelengkapan otomatis, dan tidak ada yang berhasil. sekarang saya berpikir, mungkin, setidaknya, menggunakan 'password = window.prompt' tua yang baik ("Silakan masukkan kembali kata sandi Anda") 'plus nama pengguna di sesi, dan cobalah untuk mengautentikasi itu.
David

31

Tiga opsi: Pertama:

<input type='text' autocomplete='off' />

Kedua:

<form action='' autocomplete='off'>

Ketiga (kode javascript):

$('input').attr('autocomplete', 'off');

2
Opsi pertama dan kedua harus menjadi satu opsi, karena ini bervariasi pada bagaimana browser menangani ini.
rybo111

Mencoba $ formElement.attr ('lengkapi otomatis', 'tidak aktif'); dan itu tidak berhasil.
Ben Sinclair

22

Pada yang terkait atau sebenarnya, pada catatan yang sepenuhnya berlawanan -

"Jika Anda adalah pengguna formulir yang disebutkan di atas dan ingin mengaktifkan kembali fungsi autocomplete, gunakan bookmarklet 'ingat kata sandi' dari halaman bookmarklet ini . Ini menghapus semua autocomplete="off"atribut dari semua formulir di halaman. Terus berjuang dengan baik! "


20

Kami benar-benar menggunakan ide sasb untuk satu situs. Itu adalah aplikasi web perangkat lunak medis untuk menjalankan kantor dokter. Namun, banyak klien kami adalah ahli bedah yang menggunakan banyak stasiun kerja yang berbeda, termasuk terminal semi-publik. Jadi, mereka ingin memastikan bahwa seorang dokter yang tidak memahami implikasi kata sandi yang disimpan secara otomatis atau tidak memperhatikan tidak dapat secara tidak sengaja membiarkan info masuk mereka mudah diakses. Tentu saja, ini sebelum ide penjelajahan pribadi yang mulai ditampilkan di IE8, FF3.1, dll. Meski begitu, banyak dokter dipaksa untuk menggunakan browser sekolah lama di rumah sakit dengan IT yang tidak akan berubah.

Jadi, kami meminta halaman login menghasilkan nama bidang acak yang hanya akan berfungsi untuk posting itu. Ya, itu kurang nyaman, tetapi itu hanya memukul pengguna di atas kepala tentang tidak menyimpan informasi login di terminal publik.


20

Tidak ada solusi yang berfungsi untuk saya dalam percakapan ini.

Saya akhirnya menemukan solusi HTML murni yang tidak memerlukan Javascript , bekerja di browser modern (kecuali IE; harus ada setidaknya 1 tangkapan, kan?), Dan tidak mengharuskan Anda untuk menonaktifkan pelengkapan otomatis untuk seluruh formulir.

Cukup matikan pelengkapan otomatis pada formdan kemudian nyalakan untuk apa pun yang inputAnda inginkan berfungsi dalam formulir. Sebagai contoh:

<form autocomplete="off">
    <!-- these inputs will not allow autocomplete and chrome 
         won't highlight them yellow! -->
    <input name="username"  />
    <input name="password" type="password" />
    <!-- this field will allow autocomplete to work even 
         though we've disabled it on the form -->
    <input name="another_field" autocomplete="on" />
</form>

Ini benar-benar yang saya cari!
Marco

20

Baru diatur autocomplete="off". Ada alasan yang sangat bagus untuk melakukan ini: Anda ingin memberikan fungsionalitas autocomplete sendiri!


20

Saya telah mencoba solusi tanpa akhir, dan kemudian saya menemukan ini:

Alih-alih autocomplete="off"hanya menggunakan sajaautocomplete="false"

Sesederhana itu, dan itu berfungsi seperti pesona di Google Chrome juga!


Seperti yang Anda katakan di chrome, nilai mati tidak bekerja. Itu harus "salah"
azuax

Bekerja untuk saya di Chrome 44.0.2403.130.
GuiGS

1
Mencoba ini: $ formElement.attr ('autocomplete', 'false'); maaf tidak berfungsi.
Ben Sinclair

20

Ini bekerja untuk saya.

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

Kami juga dapat menggunakan strategi ini di kontrol lain seperti teks, pilih dll


ini harus menjadi jawaban terbaru. satu-satunya jawaban yang berfungsi untuk saya dalam chrome terbaru
Nick Chan Abdullah

19

Saya pikir autocomplete=offdidukung dalam HTML 5.

Tanyakan kepada diri Anda mengapa Anda ingin melakukan ini - mungkin masuk akal dalam beberapa situasi tetapi jangan lakukan hanya demi melakukannya.

Ini kurang nyaman bagi pengguna dan bahkan bukan masalah keamanan di OS X (disebutkan oleh Soren di bawah). Jika Anda khawatir orang mencuri kata sandi mereka dari jarak jauh - pencatat keystroke masih bisa melakukannya meskipun aplikasi Anda menggunakan autcomplete=off.

Sebagai pengguna yang memilih untuk memiliki browser mengingat (sebagian besar) informasi saya, saya akan merasa menjengkelkan jika situs Anda tidak mengingat milik saya.


17

Sebagai tambahannya

autocomplete="off"

Menggunakan

readonly onfocus="this.removeAttribute('readonly');"

untuk input yang Anda tidak ingin mereka untuk mengingat data formulir ( username, password, dll) seperti yang ditunjukkan di bawah ini:

<input type="text" name="UserName" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >

<input type="password" name="Password" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >

Semoga ini membantu.


1
Bagi saya di IE11 saya tidak bisa mengetik ke dalam kotak teks bahkan setelah onfocus menghapus atribut readonly. Namun, jika saya mengklik kedua kalinya pada kotak teks maka saya bisa mengetik.
mcallahan

Saya mengalami masalah yang sama dengan IE11 (tidak bisa mengetik hingga fokus kedua). Menambahkan kabur dan kemudian fokus kembali berfungsi. $(document).on('focus', 'input:password[readonly="readonly"]', function () { $(this).prop('readonly', false).blur().focus(); });
palmsey

@ Andrew Tentu, Anda bisa. Ini adalah prinsip inti untuk mengatasi masalah ini dan saya juga menambahkan pembaruan yang berisi contoh kode lengkap;)
Murat Yıldız

Saya juga menambahkanonfocusout="this.setAttribute('readonly', 'readonly');"
rinatdobr

16

Solusi terbaik:

Cegah nama pengguna (atau email) dan kata sandi yang dilengkapi secara otomatis:

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

Mencegah pelengkapan otomatis bidang:

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

Penjelasan: autocompleteterus bekerja <input>, autocomplete="off"tidak bekerja, tetapi Anda dapat mengubah offke string acak, seperti nope.

Bekerja di:

  • Chrome: 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63 dan 64

  • Firefox: 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57 dan 58


2
Saya menemukan ini berfungsi dalam pengujian awal saya. Sangat aneh bahwa "tidak aktif" tidak berhasil.
Craig Jacobs

Ini tidak berfungsi untuk Chrome di Android. Saya sudah mencoba menetapkan nilai string untuk autocompleteatribut dan masih menampilkan entri sebelumnya sebagai saran pelengkapan otomatis di bawah input.
tebs1200

@ tebs1200 Yang mana? Bidang kata sandi atau bidang teks?
Cava

@Cava menyesal atas tanggapan yang tertunda. Bidang teks. Tidak masalah apa nilai yang saya setel autocomplete, saya masih mendapatkan dropdown saran berdasarkan nilai yang dimasukkan sebelumnya. Baik di desktop, tetapi tidak di Android chrome.
tebs1200

14

Sedikit terlambat ke permainan ... tapi saya hanya mengalami masalah ini dan mencoba beberapa kegagalan, tetapi ini bekerja untuk saya ditemukan di MDN

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 seperti:

autocomplete="nope"

13

Menambahkan

autocomplete="off"

ke tag formulir akan menonaktifkan pelengkapan otomatis peramban (yang sebelumnya diketik dalam bidang itu) dari semua inputbidang dalam formulir itu.

Diuji pada:

  • Firefox 3.5, 4 BETA
  • Internet Explorer 8
  • Chrome

13

Menambahkan autocomplete="off"tidak akan memotongnya.

Ubah atribut tipe input menjadi type="search".
Google tidak menerapkan pengisian otomatis pada input dengan jenis pencarian.


4
Itu adalah hack. Bidang ini bukan bidang pencarian. Di masa depan ini dapat menyebabkan masalah.
Roel

12

Gunakan nama dan id non-standar untuk isian, jadi alih-alih "name" have "name_". Browser kemudian tidak akan melihatnya sebagai bidang nama. Bagian terbaik tentang itu adalah bahwa Anda dapat melakukan ini pada beberapa bidang tetapi tidak semua dan itu akan melengkapi secara otomatis beberapa tetapi tidak semua bidang.


Masalahnya adalah jika ada situs lain yang menggunakan "name_" untuk mencapai tujuan yang sama maka Anda kembali ke titik awal.
ConroyP

3
jadi buatlah "mysite_name". Jika ada orang lain yang menggunakan itu, saya akan mengajukan pertanyaan ...
Steve Perks

ini mengacaukan beberapa utilitas yang populating otomatis
Simon_Weaver

12

Untuk menghindari XHTML yang tidak valid, Anda dapat mengatur atribut ini menggunakan javascript. Contoh menggunakan jQuery:

<input type="text" class="noAutoComplete" ... />

$(function() {
    $('.noAutoComplete').attr('autocomplete', 'off');
});

Masalahnya adalah bahwa pengguna tanpa javascript akan mendapatkan fungsionalitas autocomplete.


38
ini tidak menghindari xhtml yang tidak valid, itu hanya menambahkan bit yang tidak valid secara dinamis setelah Anda memeriksanya itu menyatakan itu valid!
Andiih

@Andiih: Jadi, apakah ada cara untuk membuat autocomplete berfungsi di xhtml?
cherouvim

1
Bekerja (atau berhenti bekerja yang merupakan tujuannya): ya seperti di atas. Tapi valid - tidak.
Andiih

11

coba ini juga jika autocomplete="off"tidak berfungsi:

autocorrect="off" autocapitalize="off" autocomplete="off"

11

Saya tidak percaya ini masih menjadi masalah begitu lama setelah dilaporkan. Solusi di atas tidak bekerja untuk saya, karena safari tampaknya tahu kapan elemen tidak ditampilkan atau di luar layar, namun yang berikut ini berhasil bagi saya:

<div style="height:0px; overflow:hidden; ">
  Username <input type="text" name="fake_safari_username" >
  Password <input type="password" name="fake_safari_password">
</div>

Semoga bermanfaat bagi seseorang!


1
jadi, menempatkan ini sebelum bidang nama pengguna dan kata sandi yang sebenarnya berhasil? browser mengisi mereka dan bukan yang asli
Andrew

11

Jadi ini dia:

function turnOnPasswordStyle() {
  $('#inputpassword').attr('type', "password");
}
<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">


1
Sepertinya ide bagus jika gaya kotak teks untuk mencegah flash kata sandi yang terlihat.
Andrew

1
Terima kasih banyak, ini melakukan pekerjaan +1, variasi saya untuk solusi Anda adalah membuatnya dengan satu baris: <input oninput = "this.type = 'password'" id = "inputpassword" type = "text">
Hasnaa Ibraheem

@HasnaaIbraheem Terima kasih (: terkadang lebih mudah dibaca lebih baik.
Stav Bodik

11

Ini adalah masalah keamanan yang diabaikan browser sekarang. Browser mengidentifikasi dan menyimpan konten menggunakan nama input, bahkan jika pengembang menganggap informasi itu sensitif dan tidak boleh disimpan. Membuat nama input berbeda antara 2 permintaan akan menyelesaikan masalah (tetapi masih akan disimpan dalam cache browser dan juga akan meningkatkan cache browser). Meminta pengguna untuk mengaktifkan atau menonaktifkan opsi dalam pengaturan browsernya bukanlah solusi yang baik. Masalah ini dapat diperbaiki di backend.

Inilah perbaikan saya. Suatu pendekatan yang telah saya terapkan dalam kerangka kerja saya. Semua elemen pelengkapan otomatis dihasilkan dengan input tersembunyi seperti ini:

<? $r = rmd5(rand().mocrotime(TRUE)); ?>
<form method="POST" action="./">
    <input type="text" name="<? echo $r; ?>" />
    <input type="hidden" name="__autocomplete_fix_<? echo $r; ?>" value="username" />
    <input type="submit" name="submit" value="submit" />
</form>

Server kemudian memproses variabel pos seperti ini:

foreach ($_POST as $key => $val)
{
    if(preg_match('#^__autocomplete_fix_#', $key) === 1){
        $n = substr($key, 19);
        if(isset($_POST[$n]))$_POST[$val] = $_POST[$n];
    }
}

Nilai dapat diakses seperti biasa

var_dump($_POST['username']);

Dan browser tidak akan dapat menyarankan informasi dari permintaan sebelumnya atau dari pengguna sebelumnya.

Semua berfungsi seperti pesona, meskipun peramban diperbarui, ingin mengabaikan pelengkapan otomatis atau tidak. Itu adalah cara terbaik untuk memperbaiki masalah bagi saya.


10

Tidak ada peretasan yang disebutkan di sini bekerja untuk saya di Chrome. Ada diskusi tentang masalah ini di sini: https://code.google.com/p/chromium/issues/detail?id=468153#c41

Menambahkan ini di dalam sebuah <form>karya (setidaknya untuk saat ini):

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

1
Perhatikan bahwa menggunakan teknik ini, FireFox masih akan benar-benar mengisi bidang tersembunyi itu, yang akan disertakan ketika mengirimkan formulir. Itu mungkin buruk, karena kata sandi kemudian akan ditransfer melalui koneksi yang berpotensi tidak aman. Untungnya menambahkan maxlength="0"tidak mencegah firefox mengisi secara otomatis lapangan.
Mikal Schacht Jensen

9

Anda dapat menggunakan input.

Sebagai contoh;

<input type=text name="test" autocomplete="off" />
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.