Bagaimanakah Saya Boleh Menyesuaikan Rupa dan Fungsi Elemen Input Fail?

Menyesuaikan Jenis Elemen Input Fail

Soalan ini tertumpu pada penyesuaian jenis elemen input fail, khusus untuk melaksanakan imej latar belakang, bulat sempadan dan penggayaan butang yang berpotensi.

Untuk mencapai ini tanpa kebimbangan keserasian penyemak imbas, ikuti yang disediakan langkah:

1. Borang HTML:

   • Buat borang HTML dengan butang "Klik untuk muat naik" (elemen dengan id=" yourBtn") dan input fail tersembunyi (elemen dengan id="upfile", disembunyikan oleh penggayaan).

2. Fungsi JavaScript:

   • Tambah fungsi JavaScript (getFile()) untuk mencetuskan fail tersembunyi input apabila butang "Klik untuk muat naik" adalah diklik.

Pendekatan ini membenarkan penggayaan tanpa had bagi elemen input tanpa perlu risau tentang nuansa khusus penyemak imbas.

Selain itu, untuk memudahkan lagi proses, berikut ialah contoh lengkap dengan fail automatik muat naik:

HTML:

<style>
#yourBtn {
  position: relative;
  ...
}
</style>
<form action="#" method="POST" enctype="multipart/form-data" name="myForm">
  <div>

JavaScript:

function getFile() {
  document.getElementById("upfile").click();
}
function sub(obj) {
  var file = obj.value;
  var fileName = file.split("\");
  document.getElementById("yourBtn").innerHTML = fileName[fileName.length - 1];
  document.myForm.submit();
  event.preventDefault();
}

Kod ini menggabungkan gaya butang dan klik pengendalian acara dengan muat naik fail automatik dengan menyerahkan borang apabila input berubah.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyesuaikan Rupa dan Fungsi Elemen Input Fail?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!