Intercooler.js ile HTML içine Ajax karıştırın

Hiç bu kadar kolay olmamıştı Ajax'ı herhangi bir web sitesine ekle. Aslında tüm web sitelerini oluşturmak oldukça yaygındır. Ajax isteklerine dayanarak denilen Tek Sayfalı Uygulamalar (veya SPA'lar).

Ancak bu her zaman biraz jQuery ve bazı teknik wrangling gerektirmiştir sayfa içeriğini güncelle. Sadece biraz ihtiyacınız varsa temel Ajax işlevselliği kullanabilirsiniz intercooler.js bu hakkı HTML’nize eklemek için.

Intercooler, şu HTML özelliklerini yazmanıza izin verir. yerel olarak Ajax istek URL’lerini içerir. Kullanıcılar belirli bağlantıları tıklattıklarında Ajax istekleri çalıştırma normal tıklama eylemi yerine.

Tamamı, hepsi HTML5 data- * özniteliklerine dayanır gibi ic-sonrası için. Bu özelliği bir düğmeye veya bağlantı linkine ekleyebilirsiniz. otomatik olarak jQuery'e bağlanın Ajax POST isteği için.

Aslında bir sayfa var bu özelliklerle dolu Eklenti web sitesinde. İşte biraz basit kod Nasıl göründüğünü görmek için:

Beni tıkla!

Bu olur URL’ye bir Ajax POST isteği gönder / buton_click, ve yanıtı yükle konteyner elemanının içine. Intercooler oldukça basit bir kütüphane ve nasıl çalıştığını anladıktan sonra inanılmaz derecede güçlü.

Bunun tüm Ajax problemlerinizi çözmeyeceği kabul edildi çünkü sayfanın diğer alanlarını otomatik olarak güncelleyemiyor. O da çok fazla özel özellik ekleyemiyorum Sayfayı yavaşlatmadan, bu yüzden ayrıntılı SPA gerçekten olmalı özel Ajax kodu kullanın.

Intercooler.js bir sunar Ajax kodu yazmak için daha anlamsal bir yol böylece yerel bir geri dönüş sağlar ve yükler.

için intercooler yükleyin sadece bir ihtiyacın var jQuery kopyası ile birlikte intercooler kütüphanesinin kopyası GitHub'da bulunabilir. Sen bile indirmeden test et jQuery CDN ve yerel Intercooler CDN kullanarak tüm dosyalar.

Her ikisini de içine koy > etiket sayfanızın başlığında, ve sonra HTML niteliklerini istediğiniz yere yerleştirin!

Bir göz atın demolar sayfası görmek için demoların tam listesi ile oyuncak edebilirsiniz. Özellikle 'Düzenlemek için Tıklayın' demosunu beğendim, çünkü tam olarak neyin mümkün olduğunu ve bu eklentiyi ne kadar uzağa götürebileceğinizi gösteriyor.

Eğer ilgileniyorsanız daha fazla öğrenmek kontrol et başvuru Kılavuzu intercooler'ın HTML öznitelikleriyle dolu. Her biri farklı bir eylem gerçekleştirir bu yüzden hepsini incelemek ve ne olduğunu görmek çok önemli en iyi uyar senaryonun için.

Doğal olarak bulabilirsiniz tüm kaynak kodları GitHub’da ücretsiz kısa kurulum kılavuzu.