ini adalah
bagian ke delapan dari tulisan ane (
Belajar jQuery - "Mulai dari Nol Ya.." ), langsung saja ya...
Sebelumnya ane minta maaf bagi siapa saja yang menunggu
terlalu lama kelanjutan dari tulisan ane
belajar jQuery, sampai nulis2 di komentar :D mohon dimaklumi ya, lagi banyak kerjaan ^^
#bukanSokSibuk
jQuery - AJAX
Apa itu AJAX?? nanti pasti tahu sendiri..
maaf, ane ga bisa kasi live demo nya, karena ini butuh server khusus, dan saya tidak punya itu..
Langsung saja tanpa basa-basi,, buat
New Document di Notepad++ nya.. isikan sbb (copas aja):
AJAX itu BUKAN bahasa pemrograman.<br />
<br />
Itu hanya teknik untuk membuat website berjalan lebih baik.
SAVE AS dengan nama ajax.html..
=========================================
1. Siapkan jQuery kosongan..
2. pada bagian code HTML, buat tombol dengan ID=tbLoad
<button id="tbLoad">[LOAD]</button>
3. buat juga DIV dengan ID=wadah, (tujuan kita nanti akan mencoba memasukkan file tadi ajax.html ke dalam sini)
TIPS: beri border agar kita bisa melihat wadahnya meskipun kosong, codenya seperti ini:
<div id="wadah" style="border: 1px solid black;border-radius: 5px;padding: 5px;">
</div>
4. sekarang masuk pada bagian code jQuery,, isikan sbb:
$("#tbLoad").click(function(){
$('#wadah').load('ajax.html');
});
5.
SAVE AS dengan nama
jquery - ajax.html.. dan jalankan di
Mozilla Firefox..
(ane coba di IE dan Chrome tidak berjalan, dikarenakan browser-browser ini tidak mendukung jQuery AJAX di protokol file:/// untuk alasan keamanan)
6. klik LOAD, jika wadahnya terisi dengan file yang kita buat tadi, berarti ente berhasil.. :)
================ lanjut... ======================
Buat New Document lagi,, copas sbb:
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/2/24/Guitar_1.jpg/127px-Guitar_1.jpg"/>
<br/>
<strong class="selflink">Gitar</strong> adalah sebuah <a href="/wiki/Alat_musik_berdawai" title="Alat musik berdawai" class="mw-redirect">alat musik berdawai</a> yang dimainkan dengan cara <a href="/w/index.php?title=Alat_musik_dawai_petik&action=edit&redlink=1" class="new" title="Alat musik dawai petik (halaman belum tersedia)">dipetik</a>, umumnya menggunakan <a href="/wiki/Jari" title="Jari">jari</a> maupun <a href="/wiki/Plektrum" title="Plektrum">plektrum</a>. Gitar terbentuk atas sebuah bagian tubuh pokok dengan bagian leher yang padat sebagai tempat senar yang umumnya berjumlah enam didempetkan. Gitar secara tradisional dibentuk dari berbagai jenis kayu dengan senar yang terbuat dari nilon maupun baja. Beberapa gitar modern dibuat dari material <a href="/wiki/Polikarbonat" title="Polikarbonat">polikarbonat</a>. Secara umum, gitar terbagi atas 2 jenis: akustik dan elektrik.
SAVE AS dengan nama gitar.html..
=========================================
1. buka file jquery - ajax.html yang kita buat sebelumnya..
2. tambahkan tombol lagi dengan id=tbGitar
<button id="tbLoad">[LOAD]</button>
<button id="tbGitar">[GITAR]</button>
3. tambahkan script sbb di bagian code jQuery nya:
$("#tbGitar").click(function(){
$('#wadah').load('gitar.html');
});
4. CTRL+S, dan coba jalankan di Mozilla, klik LOAD, lalu klik GITAR, klik LOAD lagi, lalu klik GITAR lagi,, dan sekarang ente pasti dapat ide untuk membuat suatu menu :D
==========================================
ini sebenarnya seperti teknik IFRAME, hanya saja ini jauh lebih menghemat resource komputer, karena hanya memodifikasi suatu tag dalam halaman tsb,, dari pada memuat suatu HTML baru di dalam HTML,, dan harus memuat CSS nya lagi..
==========================================
cukup sampai di sini saja
bagian 8 nya,, sampai jumpa di bagian berikutnya.. :D