Bazı durumlarda gidiş hattı durdurmak isteyebilirsiniz. jQuery bunun için metotlar sunmaktadır. event.preventDefault() metodunu çağırarak yapılan her hangi bir Event’i durduruyorsunuz. 5 / 5 ( 1 vote )
Continue reading...Jquery
Jquery toogleClass ile class ekleme ve silme işlemini tek kodla yapma
Jquery’de addClass() ile sınıf ekleyebiliyoruz ve removeClass() ile sınıfı siliyoruz. tooggleClass() metodu bir iki metodun bir kombinasyonudur. Eğer sınıf varsa siler, yoksa ekler. 5 / 5 ( 1 vote )
Continue reading...Jquery hasClass() metodu ile class’ın varlığını kontrol etme
Bir grup elementin veya bir grup tagın CSS sınıfı var olup olmadığını hasClass() ile kontrol edebiliriz. hasClass() metodunda parametre olarak test etmek istediğimiz sınıfın adını yazıyoruz. Aşağıda mavi yazarak mavi CSS sınıfını kontrol ettirmiş oluyorum. 4.7 / 5 ( 3 votes )
Continue reading...Jquery İle Parametre Filtrelerin Kullanımı
jQuery’deki kullanışlı filtreler parametre filtreleridir. Regular Expression gibi kullanaiblirsiniz ve Reqular Expression gibi karmaşık bir yapıya sahip olmak yerine çok basit bir yapıya sahiptirler. 4 / 5 ( 2 votes )
Continue reading...Jquery Prop Fonksiyonu İle Nesnelere Özellik Ekleme
HTML’de etiketlerde özellikleri çok sık kullanırız örnek a(anchor) etiketinde href etiketini kullanırız href etiketi a(anchor) etiketinin yönlendirme yapılacağı sayfanın belirtildiği özellik olmaktadır bu makalemizde neslere nasıl jquery ile özellik eklendiğini göreceğiz. 1 / 5 ( 4 votes )
Continue reading...Sizzle.js İle Jquery Seçicisini Kullanma
Eğer jquery seçicisi hoşunuza gittiyse jquery ekibinin sadece seçici kütüphanesi olarak hazırladığı ve dağıttığı Sizzle adlı kütüphane ile javascript geliştirmeleriniz için büyük kolaylık saplayabilir. Makalenin devamnda sizzle ile detaylı bilgiye ulaşabilirsiniz.
Continue reading...JQuery Datatables İle Tablolarınıza Profesyonel Özellikler Katın
Bu makalemizde jquery’nin en önemli eklentilerinden biri olan dataTables’i göreceğiz bu eklenti ile eşzamanlı arama, sayfalama, gösterilecek kayıt sayısı, kolona göre sıralama gibi standart html table yapınıza birçok profesyonel özellik katmaktadır. 5 / 5 ( 2 votes )
Continue reading...Jquery Mask İle İnput Nesnelerine Özel Veri Girişi Sağlamak
Bu makalemizde jquery’nin eklentilerinden biri olan mask eklentisi ile makalenin devamında ki gibi özel tarih-telefon-yüzde-ürün anahtarı gibi özel veri girişini sağlayabileceksiniz. Jquery Mask İle İnput Nesnelerine Özel Veri Girişi Sağlamak Maskedinput eklentisini kullanabilmek için öncelikle jquery’i sayfanızın head etiketleri arasına ekleyiniz ardından sayfanın en altından erişeceğiniz maskedinput sayfasından eklentiyide head etiketleri arasına yapıştırınız. Jquery ve Maskedinput scriptlerini ekledikten sonra alttaki html kodlarını sayfanıza ekleyiniz Html Kodları
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 | <table> <tr> <td>Date</td> <td><input id="date" value="1231" type="text" tabindex="1" /></td> <td>99/99/9999</td> </tr> <tr> <td>Phone</td> <td><input id="phone" type="text" tabindex="2"/></td> <td>(999) 999-9999</td> </tr> <tr> <td>Phone + Ext</td> <td><input id="phoneExt" type="text" tabindex="2"/></td> <td>(999) 999-9999? x99999</td> </tr> <tr> <td>Int'l Phone</td> <td><input id="iphone" type="text" tabindex="2"/></td> <td>+33 999 999 999</td> </tr> <tr> <td>Tax ID</td> <td><input id="tin" type="text" tabindex="3"/></td> <td>99-9999999</td> </tr> <tr> <td>SSN</td> <td><input id="ssn" type="text" tabindex="4"/></td> <td>999-99-9999</td> </tr> <tr> <td>Product Key</td> <td><input id="product" type="text" tabindex="5"/></td> <td>a*-999-a999</td> </tr> <tr> <td>Eye Script</td> <td><input id="eyescript" type="text" tabindex="6"/></td> <td>~9.99 ~9.99 999</td> </tr> <tr> <td>Purchase Order</td> <td><input id="po" type="text" tabindex="6"/></td> <td>aaa-999-***</td> </tr> <tr> <td>Percent</td> <td><input id="pct" type="text" tabindex="6"/></td> <td>99%</td> </tr> <tr> <td>Phone (autoclear=false)</td> <td><input id="phoneAutoclearFalse" type="text" tabindex="6"/></td> <td>(999) 999-9999</td> </tr> <tr> <td>Phone + Ext (autoclear=false)</td> <td><input id="phoneExtAutoclearFalse" type="text" tabindex="6"/></td> <td>(999) 999-9999? x99999</td> </tr> </table> |
Üstteki input nesnelerine sağda belirtilen formatta giriş yapabilmek içinde alttaki kodları head etiketleri arasına yapıştırınız Javascript Kodları
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 | <script type="text/javascript"> $(function() { $.mask.definitions['~'] = "[+-]"; $("#date").mask("99/99/9999", { completed: function() { alert("completed!"); } }); $("#phone").mask("(999) 999-9999"); $("#phoneExt").mask("(999) 999-9999? x99999"); $("#iphone").mask("+33 999 999 999"); $("#tin").mask("99-9999999"); $("#ssn").mask("999-99-9999"); $("#product").mask("a*-999-a999", { placeholder: " " }); $("#eyescript").mask("~9.99 ~9.99 999"); $("#po").mask("PO: aaa-999-***"); $("#pct").mask("99%"); $("#phoneAutoclearFalse").mask("(999) 999-9999", { autoclear: false, completed: function() { alert("completed autoclear!"); } }); $("#phoneExtAutoclearFalse").mask("(999) 999-9999? x99999", { autoclear: false }); $("input").blur(function() { $("#info").html("Unmasked value: " + $(this).mask()); }).dblclick(function() { $(this).unmask(); }); }); </script> |
Sonuç Maskedinput eklentisine buradan ulaşabilirsiniz. ✍ jQuery Mask konulu makalemiz için lütfen olumlu-olumsuz tüm görüşlerinizi...
Continue reading...-
- 12 Haziran 2014
- 2
- Javascript Jquery
Jquery İle Sınavlarınız İçin Örnek Cevap Anahtarı Yapımı
Bu makalemizde AÖF’e çalışırken sürekli test sorularının şıklarını bir yere not almaktan sıkıldığımdan [jquery, css, js] birleşimi ile basit bir cevap anahtarı hazırladım amacım dinamik olarak girmiş olduğumuz sayı kadar cevap anahtarı oluşturabilmek ve seçim yapabilmek.
Continue reading...Jquery Each Metodu Kullanımı Ve Örnekleri
Jqueryde each metodu ile belirtmiş olduğumuz etiketten kaç tane varsa o kadar döngü kurulacaktır. Bu döngü sayesinde döngü için belirtmilmiş etiketler arasında dögü sağlanırken index değeri ve elemanlara ulaşabilirsiniz ve gerekli işlemleri gerçekleştirebiliriz. 4.5 / 5 ( 2 votes )
Continue reading...