jQuery: Notepad++'da Attribute Kodu Değişkenlerle Bağlantılı Olarak Nasıl Kullanılır? Text Barına Otomatik Olarak Varsayılan Yazı Nasıl Eklenir? Part #9 | Turkish Video Tutorial

in #utopian-io8 years ago (edited)

Ne öğreneceğim?

  • jQuery sunucumuza, kullanıcı adı ve şifre barları oluşturup, oluşturulan barların içine "default_yourtype" komutunu ekleyerek, barın içini otomatik olarak doldurmayı öğreneceksiniz. (Örneğin: Şifre: Lütfen şifrenizi giriniz...)
  • jQuery localhost sunucusunda, paragraf, text vb. komutları girerken, bir alt satıra geçmek için "break" (br) komutunun nasıl ve nerede kullanılacağını öğreneceksiniz.
  • jQuery sunucusu için Notepad++ üzerinden Attribute (attr) komutunun, birkaç kodla birlikte nasıl kullanılacağını öğreneceksiniz.

Gereksinimler

  • jQuery 3.3.1.min.js
  • MySQL 5.7.17 (full veya developer serisi)
  • XAMPP Server
  • Javascript destekli bir Internet Tarayıcısı
  • Notepad++
  • Ortalama bir bilgisayar

Zorluk

  • Orta düzey

Açıklama

Merhaba arkadaşlar, eğitimimizin bu bölümünde, attribute (attr) kodunun, diğer kodlarla bağlantılı olarak nasıl kullanılacağını uygulamalı olarak gösterdim. Bunların yanı sıra, (p) komutumuzla birlikte, satırı aşağıya alma sorununu aynı komutun içinde br (break) komutunu kullanarak nasıl ortadan kaldırabileceğimizi anlattım. Derste, document.ready komutuyla birlikte 2 adet text barı oluşturup, birine varsayılan atayarak dolu halde nasıl oluşturacağımızı anlattım. Normalde document.ready komutumuzdan sonra $('#pw') olarak kullandığımız değişkenimizi bu videoda neden $('input[type="pw"]') şeklinde kullandığımız hakkında teknik bilgiler verdim. Eğitim serimiz, orta düzeyden zora doğru ilerleyecektir.
Videoda anlatılan tüm programlar (jQuery, FileZilla, Notepad++, XAMPP Server, MySQL) açık kaynak kodludur ve hepsinin github repository'leri bağlantılar kısmında yer almaktadır. Dilerseniz bu programların web sayfalarına ve Windows için direkt indirme bağlantılarına bağlantılar bölümünden erişebilirsiniz.

Video'da kullanılan kodlar;

<html lang="tr">
<head>
    <meta charset="utf-8">
    <title>Sargoon Utopian jQuery Egitim Serisi</title>
<head>

<body>

    <p> Kullanıcı Adı: <br /> <input type="text"/></p>
    <p> Şifre: <br /> <input type="pw" size="20"/></p>
    

<script type="text/javascript" src="js/jqueryders.js"></script>
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>

<script>
    
    $(document).ready(function() {
        var default_pw = 'Şifrenizi Giriniz';
        
        $('input[type="pw"]').attr('value', default_pw);
        
        
        
});




</script>
</body>
</html> 


Video Tutorial

Müfredat

Part 1: jQuery Kurulumu Nasıl Yapılır? Kurulumdan sonra Localhost Sunucusuna erişim için Filezilla ve XAMPP Server'da hangi ayarlar yapılmalı? Notepad++ üzerinden sunucu bağlantı kontrolü nasıl yapılır? Part #1 | Turkish Video Tutorial

Part 2: jQuery Localhost Sunucusuna Kodlarla Yazı-Paragraf Nasıl yazılır? Site kaynak adı nasıl düzenlenir? Part #2 | Turkish Video Tutorial

Part 3: jQuery Localhost Sunucusu üzerinde kodlarla nasıl resim eklenir?Alert komutu nasıl kullanılır? Part #3 | Turkish Video Tutorial

Part 4: jQuery Localhost Sunucusunda FadeIn Komutu Nasıl Kullanılır? document.ready komutu Nasıl Kullanılır? Part #4 | Turkish Video Tutorial

Part 5: jQuery Localhost sunucusu için Notepad++ üzerinde var count, a href ve input komutları aynı sayfa içinde Nasıl Kullanılır? Part #5 | Turkish Video Tutorial

Part 6: jQuery Sunucusunda Buton Ekleme, Site içi Buton Mesajı ve Butonu Özelleştirme İşlemleri Nasıl Yapılır? HTML Açıklama Satırı Ne işe yarar ve Nasıl Kullanılır? Part #6 | Turkish Video Tutorial

Part 7: jQuery Sunucusunda Değeri Atanmış Bir Butonun Değeri "attr" Komutunu Kullanarak, Tıklama Durumunda Nasıl Değişken Hale Getirilir? Part #7 | Turkish Video Tutorial

Part 8: jQuery sunucusunda CSS koduyla Satır Arkaplan Rengi ve Paragraf Rengi Nasıl Değiştirilir? Kullanılan CSS Kodları Buton Üzerine Nasıl Yazılır? Part #8 | Turkish Video Tutorial

Bağlantılar



Posted on Utopian.io - Rewarding Open Source Contributors



Posted on Utopian.io - Rewarding Open Source Contributors

Sort:  

Thank you for the contribution. It has been approved.

You can contact us on Discord.
[utopian-moderator]

@sargoon, I always try to support who contribute to open source project, upvote you.

Hey @sargoon I am @utopian-io. I have just upvoted you!

Achievements

  • You have less than 500 followers. Just gave you a gift to help you succeed!
  • Seems like you contribute quite often. AMAZING!

Community-Driven Witness!

I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!

mooncryption-utopian-witness-gif

Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x

Coin Marketplace

STEEM 0.09
TRX 0.32
JST 0.033
BTC 110949.56
ETH 3973.25
USDT 1.00
SBD 0.61