Objek Java Script

  1. Object Text

    Untuk menginputkan data kita dapat menggunakan komponen/objek text. Contoh penggunaannya dapat kita lihat pada contoh berikut :

    <HTML>
    <HEAD><TITLE>Latihan Dengan Objek Text</TITLE></HEAD>
    <BODY>
    <SCRIPT language="JavaScript">
    function tekan()
    {
       var namastr = (document.formku.nama.value);
       var alamatstr = (document.formku.alamat.value);
       document.formku.onama.value = namastr;
       document.formku.oalamat.value = alamatstr;
    }
    </SCRIPT>
    <FORM name="formku">
    <H1>Memasukkan Data Dengan Objek Teks</H1><HR>
    <PRE>
    Nama Anda : <input type="text" size="11" name="nama">
    Alamat    : <input type="text" size="25" name="alamat">
    </PRE>
    <BR>
    <input type="button" value="Kirim" onclick="tekan()">
    <input type="reset" value="Ulang">
    <H3>Output</H3>
    <PRE>
    Jadi Nama Anda Adalah : <input type="text" size="11" name="onama">
    Alamat Anda di        : <input type="text" size="25" name="oalamat">
    </BODY>
    </HTML>

    Berikut hasilnya :

  2. Object Radio

    Objek radio adalah komponen yang digunakan untuk melakukan suatu pemilihan data. Karena selalu berupa Array , untuk mengakses satu tombol radio digunakan radio[indeks]. Disamping itu objek radio juga mempunyai nili True jika dipilih dan False jika tidak. Untuk memilih suatu objek radio menggunakan properti Checked.

    Contoh :

    <HTML>
    <HEAD><TITLE>Latihan Dengan Objek Radio</TITLE></HEAD>
    <BODY>
    <SCRIPT languange ="JavaScript">
    function seks(ket)
    {
          document.formku.ojk.value = ket;
    }
    </SCRIPT>
    
    <FORM name="formku">
    <H1>Memasukkan Data Dengan Objek Radio</H1><hr>
    <p><input type="radio" value="Wanita" name="jk" onclick="seks(this.value)">Wanita
    <input type="radio" value="Pria" name="jk" onclick="seks(this.value)">Pria
    &nbsp;<input type="text" name="ojk"></p>
    <hr>
    <input type="reset" value="Clear">
    </FORM>
    
    </BODY>
    </HTML>

    Berikut hasilnya :

  3. Object Checkbox

    Objek checkbox menyimpan informasi tentang elemen form yang berupa kotak cek. Penggunaannya hampir sama seperti objek radio.

    Contoh :

    <HTML>
    <HEAD><TITLE>Latihan Dengan Objek Checkbox</TITLE></HEAD>
    <BODY>
    <SCRIPT language="JavaScript">
    function radio_box(form)
    {
       var ket = "";
       var ket1 = "";
    
       if (form.bola.checked == true)
       {
          ket = "Nonton Bola";
       }
       if (form.tv.checked == true)
       {
          ket1 = "Nonton Tv";
       }
       alert("Hobby Anda " +ket+" "+ket1);
    }
    <FORM>
    <H1>Memasukkan Data Dengan Objek Checkbox</H1><hr>
    <p>Hobby anda :
    <input type="checkbox" value="ON" name="bola">Nonton Sepak Bola
    <input type="checkbox" value="ON" name="tv">Nonton televisi</p>
    <hr>
    <p><input type="button" value="CONFIRM" onclick="radio_box(this.form)">
    <input type="reset" value="RESET"></p>
    </FORM>
    </BODY>
    </HTML>

    Berikut hasilnya :

  4. Object Textarea

    Objek textarea menyimpan informasi tentang elemen form yang berupa kotak teks dengan banyak baris.

    Contoh :

    <HTML>
    <HEAD><TITLE>Latihan Dengan Objek TextArea</TITLE></HEAD>
    <BODY>
    <SCRIPT languange ="JavaScript">
    function tekan()
    {
       var ketstr = (document.formku.Ket.value);
       document.formku.Oket.value = ketstr;
    }
    </SCRIPT>
    <FORM name ="formku">
    <H1> Memasukkan Data Dengan Objek TextArea</H1><hr>
    <H3>Keterangan :<H3><br>
    <textarea name="Ket" rows="3" cols="30"></textarea>
    <BR><BR>
    <input type="button" value="kirim" onclick="tekan()">
    <input type="reset" value="ulang">
    <H3>Output Keterangan :</H3>
    <textarea name="Oket" rows="3" cols="30"></textarea>
    </FORM>
    </BODY>
    </HTML>

    Berikut hasilnya :

  5. Object Select

    Objek Select menyimpan informasi tentang elemen form yang berupa kotak daftar. Objek select berguna apabila di dalam form terdapat banyak pilihan yang telas mempunyai nilai tertentu.

    Contoh :

    <HTML>
    <HEAD><TITLE>Latihan Dengan Objek Select</TITLE></HEAD>
    <BODY>
    <SCRIPT language="JavaScript">
    function tekan()
    {
       var jurusanstr = (document.formku.jurusan.value);
       document.formku.ojurusan.value = jurusanstr;
    }
    </SCRIPT>
    <FORM name="formku">
    <H1>Penggunaan Objek Select<H1><hr>
    <H3>Masukkan :</H3>
    Jurusan di UNIKOM :
    <select name="jurusan" Size="1">
       <option value ="Teknik Informatika"> Teknik Informatika </option>
       <option value ="Manajemen Informatika"> Manajemen Informatika </option>
       <option value ="Teknik Komputer"> Teknik Komputer </option>
       <option value ="Teknik Industri"> Teknik Industri </option>
       <option value ="Teknik Elektro"> Teknik Elektro </option>
       <option value ="Teknik Sipil"> Teknik Sipil </option>
       <option value ="Teknik Arsitektur"> Teknik Arsitektur </option>
       <option value ="Teknik Perencanaan Wil. Kota "> Perencanaan Wil. Kota </option>
    </select>
    <p><input type="button" value="kirim" onclick="tekan()">
    <input type="reset" value="ulang">
    <H3>Output jurusan :</H3>
    <input type="text" name="ojurusan" size="30">
    </FORM>
    </BODY>
    </HTML>

    Berikut hasilnya :

Bagi teman-teman yang ingin menaruh maupun menyalin artikel ini ke blog maupun media elektronik lainya, harap mencantumkan sumbernya, gunakan etika berinternet, terima kasih. Salam ivonidiego

About ivonidiego
You = What You Do

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: