MODUL X, WEB 2

PROGRAM INTERAKTIF DENGAN JAVASCRIPT
A.TUJUAN
Mahasiswa mampu memanfaatkan event onmousedown, onmouseup, onkeydown, onkeyup, onmousemove yang ada dijavascript untuk membuat program agar lebih interaktif.
B.PEMBAHASAN
Macam – macam event yang digunakan agar program yang kita buat lebih interaktif, diantaranya :
1.      onkeydown
Event ini digunakan untuk menentukan aksi yang harus dikejakan ketika tombol dikeyboard ditekan.
2.      onkeyup
Event ini digunakan untuk menentukan aksi yang harus dikejakan ketika tombol dikeyboard dilepaskan.
3.      onmousedown
Ketika kita klik kiri tombol mouse, maka akan memanggil event onmousedown yang ada dijavascript. Hal ini berguna jika kita ingin memanggil fungsi yang terpisah atau jika ada aksi user mengklik pada bagian tertentu dihalaman web
4.      onmouseup
Ketika tmelepaskan tombol mouse, maka akan memanggil event ini yang ada yang ada dijavascript. Hal ini berguna jika kita ingin memanggil fungsi-fungsi yang terpisah atau jika ada aksi user melepas tombol mouse setelah ditekan.
5.      onmousemove
Terjadi ketika user menggerakkan mouse.
Pembahasan Praktikum :
coba1.html :
a. menandakan bahwa kode yang terdapat didalamnya adalah kode HTML sehingga browser akan menerjemahkan sebagai dokumen HTML. Bagian yang terdapat dalam dan umumnya terbagi atas kepala dan badan.
b. merupakan bagian kepala. Dibagian ini kita bisa menentukan judul dokumen HTML
c. <script language=”javascript”> merupakan kode untuk mengawali javascript.
d. function hitungKar(field, count, maxchars)digunakan untuk membuat fungsi dengan nama hitungKar dengan parameter field, count dan maxchars
e. if(field.value.length>maxchars){
field.value=field.value.substring(0,maxchars);
alert(“Anda sudah Melebihi batas\nMaximal : “+maxchars+” karakter.”);
digunakan untuk mengecek kondisi variabel panjang nilai variabel field lebih besar dari variabel maxchars, jika bernilai true, maka nilai dari variabel field adalah untuk memperoleh karakter dalam sebuah variable maxchars yaitu 0, dan akan menampilkan Anda Melebihi batas Maximal…karakter.
f. else
count.value=maxchars-field.value.length;
jika kondisi bernilai false maka nilai dari variabel count adalah, variabel maxchars dikurangi panjang nilai varaibel field
g. merupakan bagian badan dalam dokumen HTML.
h.

Sisa Karakter :

digunakan untuk membuat form dengan nama Sisa Karakter, dengan tipe masukan disabled artinya tulisan yang terdapat didalam TEXTAREA tidak dapat disalin dan diubah, dengan panjang maksimal 3, dengan nilai 100 dengan nama sisakar
i. <textarea cols="40" mso-bidi-font-weight:normal"="" name="pesan" onkeydown="hitungKar(this.form.pesan, this.form.sisakar, 100); menentukan tipa masukan textarea dengan nama pesan dengan tinggi pada textarea yaitu 5, WRAP=VIRTUAL berarti kalimat yang lebih panjang dari lebar kotak masukan akan diteruskan ke baris di bawahnya, tetapi yang disimpan oleh browser tetap satu kalimat panjang yang tidak terputus., ketika klik kiri tombol mouse, maka akan memanggil event onmousedown yaitu menghitung sisa kerakter denga nilai awal 100 yang menuju kefungsi hitungKar.

j. onkeyup = “hitungKar(this.form.pesan,this.form.sisakar, 100);”> digunakan untuk menentukan aksi ketika tombol keyboard dilepaskan yaitu menuju kefungsi hitungKar untuk menghitung sisa karakter pada form dengan nilai awal 100

k. digunakan untuk membuat tombol Reset dengan  tipe masukan reset.

 

latihan.html

Pembahasan latihan sama dengan pembahasan script coba1.html hanya ditambah dengan kode :

a. Program Pengirim SMS digunakan untuk membuat tulisan Program Pengirim SMS dengan huruf tebal. B artinya bold / tebal.

b.

Banyak Karakter :

Banyak Pesan :

Pesan

Nomor Tujuan :

Isi Pesan

<textarea name="pesan" rows="5" wrap="virtual" cols="40"

onkeydown=”hitungKar(this.form.pesan, this.form.sisakar,100);”

onkeyup=”hitungKar(this.form.pesan,this.form.sisakar,100);”>

digunakan untuk membuat form dengan judul Banyak Karakter : dengan tipe masukan berupa teks, panjang maksimal 3, size 3 dengan nilai 0 dengan nama sisakar, Banyak Pesan : dengan tipe masukan berupa teks, panjang maksimal 3, size 3 dengan nilai 0 dengan nama sisapes, Nomor Tujuan : dengan tipe masukan berupa teks, panjang maksimal 12, size 15 dengan nilai 0 dengan nama notu, Isi Pesan menentukan tipa masukan textarea dengan nama pesan dengan tinggi pada textarea yaitu 5, WRAP=VIRTUALberarti kalimat yang lebih panjang dari lebar kotak masukan akan diteruskan ke baris di bawahnya, tetapi yang disimpan oleh browser tetap satu kalimat panjang yang tidak terputus., ketika klik kiri tombol mouse, maka akan memanggil event onmousedown yaitu menghitung sisa kerakter denga nilai awal 100 yang menuju kefungsi hitungKar dan digunakan untuk menentukan aksi ketika tombol keyboard dilepaskan yaitu menuju kefungsi hitungKar untuk menghitung sisa karakter pada form dengan nilai awal 100
c. digunakan untuk membuat tombol submit dengan nama / nilai Kirim
d. digunakan untuk membuat tombol Reset dengan  nilai reset.
    
C.TUGAS
D.KESIMPULAN
Setelah melaksanakan praktikum modul 10 tentang Program Interaktif dengan Javascript maka kita mampu memanfaatkan event onmousedown, onmouseup, onkeydown, onkeyup, onmousemove yang ada dijavascript untuk membuat program agar lebih interaktif.
E.LISTING [terlampir]
Advertisements

Leave a Reply

Please log in using one of these methods to post your comment:

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