Bagaimanakah Saya Boleh Menyesuaikan Gaya Input Fail Sambil Mengekalkan Keserasian Merentas Pelayar?

Fail Jenis Input Gaya: Mengatasi Cabaran Keserasian Penyemak Imbas

Menyesuaikan penampilan elemen input jenis "fail" boleh menjadi tugas yang sukar kerana kepada isu keserasian penyemak imbas. Walau bagaimanapun, dengan mengikuti beberapa langkah mudah, anda boleh mencipta gaya tersuai yang berfungsi dengan lancar merentas pelbagai penyemak imbas.

1. Buat Teg Input Fail Tersembunyi:

Mulakan dengan menyembunyikan elemen input fail lalai menggunakan CSS:

<div>

2. Simulasikan Acara Klik Menggunakan Butang Tersuai:

Buat butang tersuai dan gunakan JavaScript untuk mensimulasikan acara klik pada input fail tersembunyi:

<div>

function getFile(){
  document.getElementById("upfile").click();
}

3. Sesuaikan Penggayaan:

Anda kini boleh menggunakan sebarang penggayaan yang diingini pada elemen butang tersuai, seperti warna latar belakang, jidar dan pemformatan teks.

#yourBtn {
  background-color: #DDD;
  border: 1px dashed #BBB;
  padding: 10px;
  cursor: pointer;
}

4. Muat Naik Fail Automatik (Pilihan):

Jika mahu, anda boleh melaksanakan automatik muat naik fail menggunakan JavaScript:

function sub(obj){
  var file = obj.value;
  document.myForm.submit();
  event.preventDefault();
}

<form action="#type your action here" method="POST" enctype="multipart/form-data" name="myForm">
  <!-- ... -->
  <input>

Dengan mengikuti langkah ini, anda boleh menyesuaikan sepenuhnya penampilan elemen input fail tanpa perlu risau tentang isu keserasian merentas penyemak imbas yang berbeza.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyesuaikan Gaya Input Fail Sambil Mengekalkan Keserasian Merentas Pelayar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!