Saya memiliki masalah desain dengan Google Chrome dan fungsi pengisian otomatis bentuknya. Jika Chrome mengingat beberapa login / kata sandi, ia mengubah warna latar belakang menjadi kuning.
Berikut beberapa tangkapan layar:
Bagaimana cara menghapus latar belakang itu atau menonaktifkan autofill ini?
Jawaban:
Ubah "putih" ke warna yang Anda inginkan.
sumber
-webkit-text-fill-color
- lihat pertanyaan inibox-shadow: inset 0 0 0 1000px white !important;
Jika Anda ingin bidang input transparan, Anda dapat menggunakan transisi dan penundaan transisi.
sumber
-webkit-box-shadow
. Juga menghilangkan kebutuhan untuk memberikan nilai warna untuk deklarasi ini: nilai-nilai default akan tetap berlaku.Solusi di sini :
sumber
Di Firefox Anda dapat menonaktifkan semua pelengkapan otomatis pada formulir dengan menggunakan atribut autocomplete = "off / on". Demikian juga masing-masing item autocomplete dapat diatur menggunakan atribut yang sama.
Anda dapat menguji ini di Chrome karena seharusnya berfungsi.
sumber
autocomplete="off"
tidak dapat diakses hari ini.Jika Anda ingin mempertahankan pengisian otomatis, serta data apa pun, penangan terlampir dan fungsionalitas yang melekat pada elemen input Anda, coba skrip ini:
Itu polling sampai menemukan elemen isi ulang otomatis, klon mereka termasuk data dan peristiwa, kemudian memasukkan mereka ke DOM di lokasi yang sama dan menghapus yang asli. Itu berhenti jajak pendapat setelah itu menemukan untuk mengkloning karena isi ulang kadang-kadang mengambil satu detik setelah memuat halaman. Ini adalah variasi dari contoh kode sebelumnya, tetapi lebih kuat dan menjaga fungsionalitas sebanyak mungkin.
(Dikonfirmasi bekerja di Chrome, Firefox dan IE 8.)
sumber
CSS berikut menghapus warna latar belakang kuning dan menggantinya dengan warna latar belakang yang Anda pilih. Itu tidak menonaktifkan isi-otomatis dan tidak memerlukan hack jQuery atau Javascript.
Solusi disalin dari: Override pengisian formulir dan sorotan input dengan HTML / CSS
sumber
Bekerja untuk saya, hanya perubahan css yang diperlukan.
Anda dapat menempatkan warna apa pun sebagai pengganti #ffffff .
sumber
Sedikit berantakan tetapi berfungsi dengan baik untuk saya
sumber
Kombinasi jawaban berhasil untuk saya
sumber
Berikut adalah versi MooTools dari Jason. Memperbaikinya di Safari juga.
sumber
Ini memperbaiki masalah pada Safari dan Chrome
sumber
Ini membantu saya, versi hanya CSS.
input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset; }
di mana putih bisa menjadi warna yang Anda inginkan.
sumber
Saya menggunakan ini,
sumber
Di tag Anda, cukup masukkan baris kode kecil ini.
Namun, jangan letakkan ini di bidang nama pengguna / email / idname karena jika Anda masih mencari untuk menggunakan pelengkapan otomatis, ini akan menonaktifkannya untuk bidang ini. Tapi saya menemukan jalan keluarnya, cukup tempatkan kode pada tag input kata sandi Anda karena Anda tidak pernah mengisi kata sandi secara otomatis. Perbaikan ini harus menghapus kekuatan warna, matinain kemampuan autocomplete pada bidang email / nama pengguna Anda, dan memungkinkan Anda untuk menghindari peretasan besar seperti Jquery atau javascript.
sumber
Jika Anda ingin sepenuhnya menghilangkannya, saya telah menyesuaikan kode pada jawaban sebelumnya sehingga berfungsi pada hover, aktif, dan juga fokus:
sumber
!important
diperlukan tetapi terima kasih, ini membantu saya banyak.Inilah solusi Mootools yang melakukan hal yang sama dengan Alessandro's - menggantikan setiap input yang terpengaruh dengan yang baru.
sumber
Bagaimana dengan solusi itu:
Ini mematikan pengisian-otomatis dan pengisian-otomatis (latar belakang kuning menghilang), menunggu 100 milidetik dan kemudian mengembalikan fungsi pengisian-otomatis tanpa pengisian-otomatis.
Jika Anda memiliki input yang perlu diisi otomatis, berikan
auto-complete-on
kelas css.sumber
Tidak ada solusi yang berfungsi untuk saya, input nama pengguna dan kata sandi masih diisi dan diberi latar belakang kuning.
Jadi saya bertanya pada diri sendiri, "Bagaimana cara Chrome menentukan apa yang harus diisi otomatis pada halaman tertentu?"
"Apakah itu mencari id input, nama input? Form id? Form action?"
Melalui eksperimen saya dengan nama pengguna dan input kata sandi, hanya ada dua cara yang saya temukan yang akan menyebabkan Chrome tidak dapat menemukan bidang yang harus diisi otomatis:
1) Letakkan input kata sandi di depan input teks. 2) Beri mereka nama dan id yang sama ... atau tidak ada nama dan id.
Setelah halaman dimuat, dengan javascript Anda dapat mengubah urutan input pada halaman, atau secara dinamis memberi mereka nama dan id mereka ...
Dan Chrome tidak tahu apa yang menimpanya ... pelengkapan otomatis tidak aktif.
Retas gila, saya tahu. Tapi itu berhasil untukku.
Chrome 34.0.1847.116, OSX 10.7.5
sumber
Satu-satunya cara yang bekerja untuk saya adalah: (diperlukan jQuery)
sumber
Saya memperbaiki masalah ini untuk bidang kata sandi yang saya miliki seperti ini:
Setel jenis input ke teks, bukan kata sandi
Hapus nilai teks input dengan jQuery
Ubah tipe input menjadi kata sandi dengan jQuery
sumber
Pembaruan untuk solusi Arjans. Ketika mencoba mengubah nilai-nilai itu tidak akan membiarkan Anda. Ini berfungsi baik untuk saya. Ketika Anda fokus pada input maka itu akan menjadi kuning. cukup dekat.
sumber
Coba kode ini:
sumber
jawaban namrouti tarif sudah benar. Namun latar belakang masih menjadi kuning ketika input dipilih . Menambahkan
!important
memperbaiki masalah. Jika Anda ingin jugatextarea
danselect
dengan perilaku yang sama tambahkan sajatextarea:-webkit-autofill, select:-webkit-autofill
Hanya input
masukan, pilih, textarea
sumber
Menambahkan
autocomplete="off"
tidak akan memotongnya.Ubah atribut tipe input menjadi
type="search"
.Google tidak menerapkan pengisian otomatis pada input dengan jenis pencarian.
Semoga ini menghemat waktu Anda.
sumber
Jika Anda ingin menghindari kedipan kuning sampai css Anda diterapkan, tampar transisi pada bocah nakal itu seperti:
sumber
Solusi terakhir:
sumber
Pertanyaan Serupa: Tautan
sumber
Baru saja menemukan diri saya dengan pertanyaan yang sama. Ini bekerja untuk saya:
sumber