Temel JavaScript Doğrulamasını Gerçekleştirmek - mankenler

Çeşitli giriş türleri için JavaScript kullanarak basit temel doğrulamayı yapabilirsiniz. Bu ilk uygulama web formunun HTML'sini oluşturur. Bu alıştırmayı tamamladıktan sonra, bir form için JavaScript doğrulamasının yapılması gerekir.

1. Metin düzenleyicinizi açın ve yeni bir boş dosya oluşturun.

2. Dosya içinde şu HTML'yi yerleştirin:

   Bir form Kullanıcı Bilgisi Adı: * Adı gerekiyor 
   
   Şehir: 
   Devlet: Alabama California Colorado Florida Illinois New Jersey New York Wisconsin > Posta: 
   E-posta adresi: * E-posta gereklidir 
   Telefon Numarası: Biçim: xxx-xxx-xxxx 
   Numara Türü: İşyeri Ana Sayfa Lütfen bir seçeneği seçin 
   Şifre: * Şifre gerekli 
   Parolayı Doğrula: * Parolalar 
   ile eşleşmiyor Dosyayı form olarak kaydedin. php belge kök dizininde. 
   

3. localhost
4. / formu. php. Hatalı hizalanan form alanları ve hatalarla HTML çok kötü görünüyor. Bunu CSS ile düzeltebilirsiniz.

   

   Editörünüze yeni bir metin dosyası oluşturun ve aşağıdaki CSS'yi girin:

5. form fieldset {display: inline-block;}. radioButton {float: yok; ekran: satır içi; margin-right: 0. 1em; genişlik: 2em;} form etiket {genişlik: 8em; marj-sağ: 1em; şamandıralı: sol; metin hizalama: doğru; ekran: blok;} form girişi {width: 15em;} #submit {margin-top: 2em; Sağa çık;}. errorClass {background-color: # CC6666;} #errorDiv {col veya: red;}. errorFeedback {visibility: hidden;}

   Dosyayı form olarak kaydedin. css belge kök dizininde.
   

6. Bu dosya, 2. adımda oluşturduğunuz HTML'de zaten referans alınmıştı, bu nedenle bu dosyaya başka bir değişiklik yapmanız gerekmiyor.

   Formu yenileyin. php dosyasını tarayıcınıza ekleyin.

7. HTML ve CSS yerinde olduğunda, şimdi biraz JavaScript ekleme zamanı geldi.

   

   Not: Doğrulama kodunu daha sonra bu bölümde oluşturacaksınız. Şimdilik, basit bir JavaScript dosyası eklemeniz yeterlidir.

   Editörünüzde yeni bir metin dosyası oluşturun.

8. Aşağıdaki JavaScript'i dosyaya yerleştirin.

9. $ (document). hazır (işlev () {alert ("hello");});

   Dosyayı form olarak kaydedin. js doküman kökünde.
   

10. Formu yeniden yükle. web tarayıcınızda php.

11. İletişim kutusunu kapatmak için Tamam'ı tıklayın.

    

12. Uyarı iletişim kutusunun kendisi yeni bir şey değil, HTML ve JavaScript'i bu alıştırma için doğru şekilde bağladığınızı ispatlıyor. Buradan, forma JavaScript doğrulama eklemeye çalışabilirsiniz. Bunu yapmadan önce, oluşturduğunuz HTML ve CSS'nin bazılarını parçalamanız yararlı olabilir.