Jumat

Cara Membuat Text Area dengan Fasilitas Select All

Text area adalah sebuah perintah HTML yang berfungsi untuk membuat kotak yang contohnya seperti dibawah ini:

kode yang kita gunakan seperti ini:
<form name="textarea"><textarea name="txt" rows="2" cols="20" onclick="this.form.txt.select()" readonly="readonly" style="border-color: gray; color: blue; background-color: white; font-weight: bold;">Text>></textarea></form>
Kode yang berwarna hijau adalah text yang ingin ditampilkan
Kode yang berwarna biru adalah warna text
Kode yang berwarna putih adalah background text area
mudahkan!!!

Membuat kotak teks/text area dengan fasilitas Select All
Tadi kita sudah membahas tentang cara membuat text area. Nah sekarang kita akan membahas tentang kelanjutannya yaitu text area dengan tombol select all.

Tombol select all adalah sebuah tombol yang digunakan untuk menghighlight seluruh teks yang berada didalam text area sehingga kita atau pengunjung bisa lebih mudah untuk mengcopy seluruh teks atau kode yang berada dalam text area.

Nah agar lebih jelas silahkan anda klik tombol Select All yang ada dibawah ini


Tambahkan kode ini ke blog anda
<form name="copy"><div align="center"><input value="Select All" onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"/></div><p style="text-align: center;"><textarea style="padding: 3px; width: 300px; height: 50px;" name="txt">Tulis text ataupun kode yang mau anda tampilkan disini</textarea></p></form>
Jika anda ingin membuat text area dengan tombol Select All berada dibawah seperti contoh dibawah ini


Maka gunakan kode ini:
<form name="copy"><div style="text-align: center;"><textarea style="padding: 3px; width: 300px; height: 50px;" name="txt">Tulis text ataupun kode yang mau anda tampilkan disini</textarea></div><p align="center"><input value="Select All" onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"/></p></form>
Keterangan:
- Teks "Select All" merupakan nama tombol. Anda bisa menggantinya dengan nama lain.
- Teks berwarna merah adalah teks muncul didalam kotak. Silahkan diganti dengan teks atau kode anda.

Selamat mencoba..