Sayfa yenilemeye gerek kalmadan jquery ile input range değerlerini alıp işlemeye yönelik bir örnek.

Web sayfalarında kullanıcı etkileşimi ile sağlanan bazı değişiklikleri sayfayı yenilemeden kullanmak istediğimizde javascript ve özel olarak bir javascript kütüphanesi olan jquery, hemen imdadımıza yetişir. Çağa bir türlü ayak uyduramamış internet explorer gibi bir tarayıcıyı olması gerektiği gibi zaten yok sayarsak, jquery kütüphanesini rahatlıkla kullanabileceğimizi biliyoruz. Jquery ile input range elemanını kullanımda, iyi bir kullanıcı deneyimi sağlayabiliriz. Aşağıdaki örneği, sayfamızın yazı, resim boyutu, renklerini, formlarımızda yer alan ücret, öğe sayısı, ürün boyutu, kapasite vb. değerleri kolayca belirleyip uygulayabilme gibi basit işlemlerde doğrudan kullanabileceğimiz gibi, daha karmaşık etkileşim ve uygulama sonuçlarına da uyarlayabiliriz.

Örneği http://www.jqueryrain.com sitesinde gösterilen bir jsfiddle.net kod paylaşımından aldım. Bazı uygulamalarda daha öncesinde ihtiyaç duyduğum için, sizin de işinize yarayabileceğini düşündüm. Bu yüzden hem sizin hem de kendim için buraya not düşmeye karar verdim. Bu kodları uyarladığım yapıları düzenleyip, geliştirilmiş uyarlamalar olarak ilerleyen zamanlarda burada paylaşmaya çalışacağım.


Kaynak: http://www.jqueryrain.com/?nsZ8ZoYa

Yazar: JOEHOELLER