Bagaimanakah saya boleh mengalih keluar Teks Pemegang Tempat pada Fokus dalam Chrome?

Mengalih keluar Teks Pemegang Tempat pada Fokus dengan CSS atau jQuery

Apabila memasukkan teks ke dalam medan teks, teks pemegang tempat biasanya hilang untuk memberi laluan kepada input pengguna. Walaupun kebanyakan penyemak imbas melakukan perkara ini secara automatik, Chrome tidak melakukannya.

Penyelesaian CSS

Untuk menyasarkan Chrome secara khusus, anda boleh menggunakan input:focus::pemilih pemegang tempat:

input:focus::placeholder {
  color: transparent;
}

Peraturan CSS ini menetapkan teks pemegang tempat kepada telus apabila medan input berada dalam fokus.

Penyelesaian jQuery

Anda juga boleh mencapainya dengan jQuery:

$("input").on("focus", function() {
  $(this).attr("placeholder", "");
});

$("input").on("blur", function() {
  $(this).attr("placeholder", "Type something here!");
});

Kod jQuery ini menetapkan teks pemegang tempat kepada rentetan kosong apabila medan input berada dalam fokus dan memulihkannya kepada teks yang diingini apabila medan hilang fokus.

Sokongan Pelayar

KEMASKINI:

Semua penyemak imbas moden kini menyokong menyembunyikan teks pemegang tempat pada fokus menggunakan pemilih CSS input:focus::placeholder. Oleh itu, penyelesaian jQuery tidak lagi diperlukan.

Atas ialah kandungan terperinci Bagaimanakah saya boleh mengalih keluar Teks Pemegang Tempat pada Fokus dalam Chrome?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!