April 27, 2014

Cara Membuat Text Area dengan Tombol Select All

Cara Membuat Text Area dengan Tombol Select All
Image by alfianCMX
Cara Membuat Text Area dengan Tombol Select All - Teks area adalah sebuah kotak persegi yang digunakan untuk memuat kode scrpit HTML. Dimana kotak tersebut digunakan untuk tempat menyimpan atau menampilkan kode" HTML dalam bentuk text. 
Dan dipembahasan kali ini saya akan memberikan tutorial Cara Membuat Text Area dengan Tombol Select All. Ini merupakan modifikasi dari text area itu sendiri dimana ditambahkan tombol Select All. tentunya agar mempermudah pengunjung untuk mendapatkan kode HTML tanpa susah" memblok kodenya kebawah.
Dibawah ini saya akan berikan gambaran asli dari text area, dan gambaran text area dengan menggunakan tombol Select All. Sobat juga dapat memodifikasi sesuai keinginan sobat. Oke disimak baik-baik ya

  • Kode dasar text area 

Kotak diatas merupakan dasar dari text area , untuk membuat kotak seperti itu sangatlah mudah sobat , copy paste kode dibawah ini lalu letakkan di HTML disamping Compose : <textarea cols="27" rows="1" Belajar membuat Text Area :) </textarea> Keterangan : Rubah cols , rows dan "Belajar membuat Text Area :)" sesuai yang kalian inginkan.
  • Kode text area dengan tombol Select All



Nah kalo kotak diatas merupakan modifikasi dari text area, disini sana menambahkan tombol Select All dan juga background pada kotak text area.Copy paste kode dibawah ini kemudian letakkan di HTML disamping Compose :
<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Select All" /><div align="center"><textarea cols="55" readonly="name="txt" rows="100" style="background: #1b1b1d; color: white; height: 60px; width: 400px;" wrap="VIRTUAL">Ketik teks/kode html yang anda inginkan :)</textarea></div></form></div>

  • Keterangan :

[<div align="center">]
Kode diatas merupakan kode agar kotak text area menjadi center (rata tengah) , sobat bisa merubahnya menjadi rata kiri atau juga rata kanan.
[<input onclick="javascript:this.form.txt.focus();this.form.txt.select();"]
Kode diatas merupakan kode yang memuat perintah block all. Jadi agar tidak terjadi eror , kode ini tidak usah dirubah-rubah.
[type="button" value="Select All" />]
Yang diblok merah merupakan nama dari tombolnya, dan dapat diganti sesuai keinginan anda masing-masing.
[readonly="]
Kode diatas berfungsi sebagai pengunci tulisan yang berada ditextarea agar tidak dapat dirubah. Kode ini cukup penting,terutama untuk text area yang berisi script agar pembaca tidak dapat mengubah isi didalam kotak textarea.
[style="background: #1b1b1d; color: white; height: 60px; width: 400px;"]
Kode diatas merupakan kode untuk merubah background , tinggi dan lebar kotak textarea, sobat bisa merubahnya sesuai selera. Jika tulisan yang berada didalam kotak text area banyak, maka akan muncul scroll secara otomatis. Dan jika sobat menginginkan background berwarna putih hapus saja kode background: #1b1b1d;
[Ketik teks/kode html yang anda inginkan :)]
Merupakan isi dari kotak pada text area , silakan ganti dengan kebutuhan sobat dan jika tulisan yang berada didalam kotak text area banyak, maka akan muncul scroll secara otomatis.
Baca juga MENGATASI TOMBOL BALAS/REPLY YANG TIDAK BERFUNGSI
Warna-warni banget ya postinganku kali ini ?hahahaa :P. Gimana sobat mudah sekali kan ? jika sobat ingin bereksperimen silakan klik link ini http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_textarea. Oke sobat sekian yang bisa saya share tentang Cara Membuat Text Area dengan Tombol Select All. Tunggu update-update selanjutnya yang pastinya semakin bermanfaat untuk anda. Selamat mencoba :)

Bagikan Artikel

Jangan lewatkan

Cara Membuat Text Area dengan Tombol Select All
4/ 5
Oleh

Ingin mendapatkan uang dari internet??

Mau tau bangaimana saya menghasilkan uang dari internet?? Tambahkan email Anda untuk mengetahuinya.

4 komentar

Tulis komentar
avatar
Anonymous
April 27, 2014 at 10:18 PM

bagus nih tutorialnya mantap banget,izin nyobain yamas

Reply
avatar
April 27, 2014 at 10:26 PM

silakan gan , makasih ya kunjungan baliknya :)

Reply
avatar
April 28, 2014 at 7:36 AM

Cakep ya, jadi lebih berwarnaaaa :D

Reply
avatar
April 28, 2014 at 12:34 PM

hahaa iya mbak , makasih kunjungannya ;)

Reply

Peraturan Berkomentar di situs alfiancmx.blogspot.co.id

1. Berkomentarlah Sesuai Topik Artikel
2. Berkomentarlah Menggunakan Bahasa Yang Jelas
3. Berkomentarlah Dengan Sopan
4. Tidak Menyisipkan Link Aktif (Live Link)
5. Tidak Berkomentar Promosi
6. Tidak Berkomentar Spam

Apabila melanggar mohon maaf komentar pasti saya hapus :)