jQuery merupakan salah satu skrip terpenting saya rasa pada pengembangan web, jQuery sendiri merupakan kumpulan dari fungsi javascript yang bisa memudahkan kita dalam membangun web.

Nah ini karena barusan ada yang tanya di chat (fadli):

saya lagi belajar buat formulir, tapi ada satu fitur yg belum saya temukan solusinya. yaitu ada satu kolom textarea yang secara default mau saya hidden. tapi ketika orang selesai mengisi formulir itu & klik tombol submit kolom textarea itu baru muncul. saya pernah lihat beberapa website pakai cara semacam <div id=”hide”> dan semacamnya, tapi saya blm nemu itu namanya apa jadi saya kesulitan waktu searching untuk pakai keyword yang dimaksud. mungkin mas ahlul tahu apa namanya ya/

He2 jadi saya postingkan saja di sini biar semua kebagian tipsnya.

Menggunakan jQuery untuk Show/Hide element

Yang perlu dilakukan pada dibagian awal adalah mendeklarasikan jQuery pada bagian header, ini bisa dilakukan dengan.

[sourcecode lang="html"][/sourcecode]

Kemudian tambahkan juga dibagian header seperti ini:

[sourcecode lang="html"][/sourcecode]

Dan pada bagian body anda bisa menambahkan seperti berikut ini:

[sourcecode lang="html"]

ShowHide

[/sourcecode]

Penjelasan

Contoh di atas menggunakan API jquery, yaitu .show dan .hide().

Pada body saya tambahkan link yang ketika di klik maka menjalankan fungsi yang dikehendaki terhadap salah satu element.

He2 begitu singkat cuma karena kodenya juga dikit :)

Semoga bermanfaat.

Demo bisa di lihat di:

http://ahlul.web.id/demo/show-hide-element-with-jquery/

Related posts:

  1. Show time ago (facebook/twitter like) on wordpress
  2. Show Al-Quran on your Blog
  3. The Simplest Custom Yahoo Online Status Ever
  4. How to Install HyperVM
  5. PHP: Mass chmod config files

6 Responses so far.

  1. fadli says:

    wah, terima kasih banyak mas ahlul!

    tapi kalau saya disini untuk mengeksekusi/menampilkan textareanya melalui tombol submit mas. sedangkan tombol submitnya sudah punya nilai onclick=”verify();” untuk memastikan semua kolom harus diisi.

    apa bisa digabung mas antara onclick=”verify();” dengan onclick=”show(‘#element’)” ? kalau bisa, bagaimana caranya? terima kasih sekali lagi…

  2. @fadli
    Iyup bisa: onClick=”show(‘#element’);verify();”

  3. andi says:

    wah,, mantaph,, kapan2 kalo saya punya masalah di jQuery, tanya disini juga ya mas,, mohon bimbingannya.. ^_^

    kunjungin http://andiim3.com donk,, dibuat make jQuery juga.. mungkin mas ada saran, bisa dicomment di chatBox

  4. fadli says:

    keren…!
    dah ngerti sekarang saya. terima kasih banyak mas ahlul!

  5. jaka zulham says:

    kern, kayak difforum forum kaskus

  6. jombi says:

    mas kebutulan ini saya mau tanya tentang chat box kayak facebok , saya kan udah download dah coba di aplikasikan dan hasilnya oke , masalahnya gini mas kalau misalnya yang pake cuma beberapa user, misal 10, tuch aplikasi berjalan lalncar tapi ,kalau yang make nya banyak suka nyasar bisa dibilang salah kamar, tolong dong mas minta solusinya saya pusing neh…pleas bls k email saya ya mas… terimaksih

Leave a Reply