Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Membuat Ketinggian Textarea Penyesuaian Sendiri dalam JavaScript?

Bagaimanakah Saya Boleh Membuat Ketinggian Textarea Penyesuaian Sendiri dalam JavaScript?

Susan Sarandon
Susan Sarandonasal
2024-12-16 03:05:10698semak imbas

How Can I Create a Self-Adjusting Textarea Height in JavaScript?

Textarea Auto Height: Menetapkan Ketinggian Berdasarkan Kandungan

S&J:

S: Bagaimana bolehkah saya membuat ketinggian textarea menyesuaikan diri dengan ketinggian kandungan teksnya, menghapuskan keperluan untuk a bar skrol?

J: Berikut ialah penyelesaian JavaScript:

function auto_grow(element) {
  element.style.height = "5px";
  element.style.height = (element.scrollHeight) + "px";
}

Untuk menggunakan kod ini, tambahkan gaya CSS berikut pada kawasan teks anda:

textarea {
  resize: none;
  overflow: hidden;
  min-height: 50px;
  max-height: 100px;
}

Berikut ialah contoh HTML:

<textarea oninput="auto_grow(this)"></textarea>

Ini kod:

  1. Menetapkan ketinggian awal kawasan teks kepada 5px.
  2. Mengira semula ketinggian berdasarkan ketinggian skrol, iaitu ketinggian kandungan teks.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Membuat Ketinggian Textarea Penyesuaian Sendiri dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn