Selasa, 10 Januari 2017

BAB 11. JAVASCRIPT 2


11.1 Objek Dalam Javascript
A. Objek Text
Untuk meng-input-kan data,kita dapat menggunakan komponen/objek text.
Contoh penggunaannya dapat kita lihat contoh dibawah ini:
<html>
<head><title>Objek Text</title></head>
<body>
            <script type="text/javascript">
                        <!--
                        function tekan()
                        {
                                    var namastr = (dokumen.formisi.nama.value);
                                    var alamatstr = (dokumen.formisi.nama.value);
                                    dokumen.formisi.inama.value = namastr;
                                    dokumen.formisi.ialamat.value = alamatstr;
                        }
                        //-->
            </script>
            <form name="formisi">
                        <H1>Maukkan Teks Kita Disini</H1><hr>
                        <PRE>
                                    Nama Kita : <input type="text" size="25" 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>
                                    Nama Kamu adalah :<input type="text" size="11" name="inama">
                                    Kamu tinggal di :<input type="text" size="25" name="ialamat">
                                    </PRE>
                                    </BR>
            </form>
</body>
</html>
b.       Objek Radio
Objek radio adalah komponen yang digunakan untuk melakukan suatu pemilihan data. Karena selalu berupa Array,untuk mengakses satu tombol radio digunakan radio (indeks). Objek radio juga memiliki nilai True jika dipilih dan False. Untuk memilih suatu objek radio digunakan properti Checked.
<!DOCTYPE html>
<html>
<head>
            <title>Objek Radio</title>
</head>
<body>
<script languange="Javascript">
            <!--
            function radio_box(form)
            {
                        var ket = "";
                        if (form.wanita.checked == true)
                        {
                                    ket ="Wanita";
                        }
                        else
                        {
                                    ket ="Pria";
                        }
                        alert ('Jenis kelamin Kita Adalah ' +ket);
            }
            //-->
</script>
<form>
            <H1>Pilih Objek Radio Jika Kita Wanita</H1><hr>
            <p><input type="radio" value="wanita"
            name="wanita">Wanita</p>
            <hr>
            <p><input type="button" value="Konfirmasi"
            onclick="radio_box(this.form)">
            <input type="reset" value="Reset"></p>
</form>
</body>
</html>

c.       Objek Checkbox.
Objek checkbox menyimpan informasi tentang elemen form yang berupa kotak cek.
Contoh :
<!DOCTYPE html>
<html>
<head>
            <title>Objek Checkbox</title>
</head>
<body>
<script languange="Javascript">
            <!--
            function radio_box(form)
            {
                        var ket = "";
                        var ket1 ="";
                        if (form.bola.checked == true)
                        {
                                    ket ="Main atau Nonton,Pokoknya Bola";
                        }
                        if (form.musik.checked == true)
                        {
                                    ket1 = " Dengerin Musik";
                        }
                        alert('Kamu Punya Hobby ' +ket+' n '+ket1);
            }
            //-->
</script>
<form>
            <H1> Pilihan dengan Objek Checkbox</H1><hr>
            <p>Hobby kita :
            <input type="Checkbox" value="ON" name="bola"> Sepak
            Bola
            <input type="Checkbox" value="ON" name="musik">Musik
            (dengar ajah)</p>
            <hr>
            <p><input type="button" value="OK"
            onclick="radio_box(this.form)">
            <input type="reset" value="Reset"></p>
</form>
</body>
</html>

d.      Objek TextArea
Objek TextArea menyimpan informasi tentang elemen form yang berupa kotak teks dengan banyak garis.
Contoh :
<script languange ="Javascript">
            <!--
            function tekan()
            {
                        var ketstr = (dokumen.form.Ket.value);
                        dokumen.form.hket.value = ketstr;
            }
            //-->
</script>
<form name="form">
<H1> Masukkan Teks ke Dalam 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="hket" rows="3" cols="30"></textarea>
</form>

e.       Objek Select
Objek select menyimpan informasi tentang elemen form berupa kotak daftar. Objek select berguna apabila didalam form terdapat banyak pilihan yang telah mempunyai nilai tertentu.
Contoh :
<script languange ="Javascript">
<!--
function tekan()
{
            var jurusanstr = (dokumen.form.Jurusan.value);
            dokumen.form.hjurusan.value = jurusan;
}
//-->
</script>
<form name="form">
<H1>Contoh denhan Objek Select</H1><hr>
<h3>Masukkan :</h3>
Jurusan di AMIK BINUS :<select name="Jurusan" Size="1">
            <option value="Manajemen Informatika">Manajemen
            Informatika</option>
            <option value="Teknik Komputer">Teknik Informatika
            </option>
</select>
<p><input type="button" value="kirim"
onclick="tekan()">
<input type="reset" value="Lagi">
<H3>Hasil Jurusan :</H3>
<input type="text" name="hjurusan" size="30"></p>
</form>




Tidak ada komentar:

Posting Komentar