SlideShare a Scribd company logo
1 of 4
Download to read offline
E:test.html                                                     Sunday, August 23, 2009 11:10 PM

Noi dung file c:test.css:
body {
  text-align: center;
}

div.formContent {
  margin: 0 auto;
  text-align: left;
  width: 400px;
}

div.textElement {
  float: left;
  text-align: right;
  width: 100px;
}

div.inputElement {
  float: left;
  width: 298px;
}



Noi dung file c:test.html:
<HTML>
  <HEAD>
    <link rel="stylesheet" type="text/css" href="test.css" />
    <script>
       function kiemTraRong(tenDieuKhien, giaTri) {
         if (giaTri == "") {
           alert(tenDieuKhien + " phai co gia tri");
         }
       }

           function kiemTraForm() {
             var hoaCanh = document.getElementById("hoaCanh");

               if (hoaCanh.ten.value == "") {
                 return ;
               }

               if (hoaCanh.diaChi.value == "") {
                 return ;
               }

               if (hoaCanh.dienThoai.value == "") {
                 return ;
               }

               if (hoaCanh.email.value == "") {
                 return ;
               }

               if (hoaCanh.soLuong.value == "") {
                 return ;
               }


                                                      -1-
E:test.html                                                                Sunday, August 23, 2009 11:10 PM

               if (hoaCanh.yeuCau.innerHTML == "") {
                 return ;
               }

               hoaCanh.submit();
      }
    </script>
  </HEAD>
  <BODY>
    <div class="formContent">
      <form action="http://google.com" id="hoaCanh" >
         <div class="formElement">
           <div class="textElement">
             Ho ten:
           </div>
           <div class="inputElement">
             <input type="text" name="ten" value="" onblur="kiemTraRong('Ho ten',
this.value);" /><span>*</span>
           </div>
           <div class="clear" ></div>
         </div>
         <div class="formElement">
           <div class="textElement">
             Dia chi:
           </div>
           <div class="inputElement">
             <input type="text" name="diaChi" value="" onblur="kiemTraRong('Dia chi',
this.value);" /><span>*</span>
           </div>
           <div class="clear" ></div>
         </div>
         <div class="formElement">
           <div class="textElement">
             Dien thoai:
           </div>
           <div class="inputElement">
             <input type="text" name="dienThoai" value="" onblur="kiemTraRong('Dien thoai',
this.value);" /><span>*</span>
           </div>
         </div>
         <div class="formElement">
           <div class="textElement">
             Email:
           </div>
           <div class="inputElement">
             <input type="text" name="email" value="" onblur="kiemTraRong('Email',
this.value);" /><span>*</span>
           </div>
         </div>
         <div class="formElement">
           <div class="textElement">
             Loai hoa:
           </div>
           <div class="inputElement">
             <select name="loaiHoa">
                <option value="thuocduoc">Hoa thuoc duoc</option>
                <option value="hoahong">Hoa hong</option>

                                                       -2-
E:test.html                                                                Sunday, August 23, 2009 11:10 PM

             </select>
             Mau:
             <select name="mau">
               <option value="do">Do</option>
               <option value="hong">Hong</option>
             </select>
           </div>
        </div>
        <div class="formElement">
           <div class="textElement">
             So luong:
           </div>
           <div class="inputElement">
             <input type="text" name="soLuong" value="" onblur="kiemTraRong('So luong',
this.value);" /><span>*</span>
           </div>
        </div>
        <div class="formElement">
           <div class="textElement">
             Don vi tinh:
           </div>
           <div class="inputElement">
             <input type="radio" name="donVi" value="nhanh" />Nhanh
             <input type="radio" name="donVi" value="bo" />Bo
             <input type="radio" name="donVi" value="chau" />Chau
           </div>
        </div>
        <div class="formElement">
           <div class="textElement">
             Thanh toan:
           </div>
           <div class="inputElement">
             <input type="radio" name="thanhToan" value="tienMat" />Tien mat
             <input type="radio" name="thanhToan" value="chuyenKhoan" />Chuyen khoan
             <input type="radio" name="thanhToan" value="sec" />Sec
           </div>
        </div>
        <div class="formElement">
           <div class="textElement">
             Yeu cau
           </div>
           <div class="inputElement">
             <textarea name="yeuCau" onblur="kiemTraRong('Yeu cau', this.innerHTML);" >
             </textarea>
           </div>
        </div>
        <div class="formElement">
           <div class="textElement">
           </div>
           <div class="inputElement">
             <input type="button" value="Dang ky" onclick="kiemTraForm();" />
             <input type="reset" value="Xoa thong tin" />
           </div>
        </div>
      </form>
    </div>
  </BODY>

                                               -3-
E:test.html         Sunday, August 23, 2009 11:10 PM

</HTML>




               -4-

More Related Content

What's hot

Mantto con vb2010
Mantto con vb2010Mantto con vb2010
Mantto con vb2010tihuilo
 
Crud secara simultan ala php myadmin
Crud secara simultan ala php myadminCrud secara simultan ala php myadmin
Crud secara simultan ala php myadminRizal Di Caprio
 
PROYECTO PRUEBA DE CONEXIONES (Mantenimiento)
PROYECTO PRUEBA DE CONEXIONES (Mantenimiento)PROYECTO PRUEBA DE CONEXIONES (Mantenimiento)
PROYECTO PRUEBA DE CONEXIONES (Mantenimiento)Darwin Durand
 
Working With Ajax Frameworks
Working With Ajax FrameworksWorking With Ajax Frameworks
Working With Ajax FrameworksJonathan Snook
 
第二节课:html5 – web开发步入新阶段
第二节课:html5 – web开发步入新阶段第二节课:html5 – web开发步入新阶段
第二节课:html5 – web开发步入新阶段Tommy Chang
 
Javascript技巧参考大全
Javascript技巧参考大全Javascript技巧参考大全
Javascript技巧参考大全fgghyyfk
 
Peek inside the fantastical Ukrainian Village home and studio of artists Jare...
Peek inside the fantastical Ukrainian Village home and studio of artists Jare...Peek inside the fantastical Ukrainian Village home and studio of artists Jare...
Peek inside the fantastical Ukrainian Village home and studio of artists Jare...irwinvifxcfesre
 
Drupal Cms Prezentace
Drupal Cms PrezentaceDrupal Cms Prezentace
Drupal Cms PrezentaceTomáš Kafka
 
Documentacion edderson callpa_ortiz
Documentacion edderson callpa_ortizDocumentacion edderson callpa_ortiz
Documentacion edderson callpa_ortizEdderson J. Ortiz
 
Android Fast Track CRUD Android PHP MySql
Android Fast Track CRUD Android PHP MySqlAndroid Fast Track CRUD Android PHP MySql
Android Fast Track CRUD Android PHP MySqlAgus Haryanto
 

What's hot (19)

Alaindavila
AlaindavilaAlaindavila
Alaindavila
 
Jquery ui, ajax
Jquery ui, ajaxJquery ui, ajax
Jquery ui, ajax
 
DOCUMENTACION PAGINA WEB PHP
DOCUMENTACION PAGINA WEB PHPDOCUMENTACION PAGINA WEB PHP
DOCUMENTACION PAGINA WEB PHP
 
Jformino
JforminoJformino
Jformino
 
Phpex3
Phpex3Phpex3
Phpex3
 
jQuery for beginners
jQuery for beginnersjQuery for beginners
jQuery for beginners
 
Mantto con vb2010
Mantto con vb2010Mantto con vb2010
Mantto con vb2010
 
Crud secara simultan ala php myadmin
Crud secara simultan ala php myadminCrud secara simultan ala php myadmin
Crud secara simultan ala php myadmin
 
PROYECTO PRUEBA DE CONEXIONES (Mantenimiento)
PROYECTO PRUEBA DE CONEXIONES (Mantenimiento)PROYECTO PRUEBA DE CONEXIONES (Mantenimiento)
PROYECTO PRUEBA DE CONEXIONES (Mantenimiento)
 
Jquery Framework
Jquery FrameworkJquery Framework
Jquery Framework
 
Jquery2
Jquery2Jquery2
Jquery2
 
Working With Ajax Frameworks
Working With Ajax FrameworksWorking With Ajax Frameworks
Working With Ajax Frameworks
 
第二节课:html5 – web开发步入新阶段
第二节课:html5 – web开发步入新阶段第二节课:html5 – web开发步入新阶段
第二节课:html5 – web开发步入新阶段
 
Javascript技巧参考大全
Javascript技巧参考大全Javascript技巧参考大全
Javascript技巧参考大全
 
Peek inside the fantastical Ukrainian Village home and studio of artists Jare...
Peek inside the fantastical Ukrainian Village home and studio of artists Jare...Peek inside the fantastical Ukrainian Village home and studio of artists Jare...
Peek inside the fantastical Ukrainian Village home and studio of artists Jare...
 
Drupal Cms Prezentace
Drupal Cms PrezentaceDrupal Cms Prezentace
Drupal Cms Prezentace
 
jQueryチュートリアル
jQueryチュートリアルjQueryチュートリアル
jQueryチュートリアル
 
Documentacion edderson callpa_ortiz
Documentacion edderson callpa_ortizDocumentacion edderson callpa_ortiz
Documentacion edderson callpa_ortiz
 
Android Fast Track CRUD Android PHP MySql
Android Fast Track CRUD Android PHP MySqlAndroid Fast Track CRUD Android PHP MySql
Android Fast Track CRUD Android PHP MySql
 

Viewers also liked

Viewers also liked (8)

T3
T3T3
T3
 
T2
T2T2
T2
 
Session 09
Session 09Session 09
Session 09
 
Session 01
Session 01Session 01
Session 01
 
Hangman Game
Hangman GameHangman Game
Hangman Game
 
Session 15
Session 15Session 15
Session 15
 
Bai Tap Thuc Hanh Javascript
Bai Tap Thuc Hanh JavascriptBai Tap Thuc Hanh Javascript
Bai Tap Thuc Hanh Javascript
 
Tim hieu lenh trong pic16 f877a
Tim hieu lenh trong pic16 f877aTim hieu lenh trong pic16 f877a
Tim hieu lenh trong pic16 f877a
 

More from SamQuiDaiBo

More from SamQuiDaiBo (20)

Session 10 Final
Session 10 FinalSession 10 Final
Session 10 Final
 
Session 09 Final
Session 09 FinalSession 09 Final
Session 09 Final
 
Session 08 Final
Session 08 FinalSession 08 Final
Session 08 Final
 
Session 07 Final
Session 07 FinalSession 07 Final
Session 07 Final
 
Session 05 Final
Session 05 FinalSession 05 Final
Session 05 Final
 
Session 06 Final
Session 06 FinalSession 06 Final
Session 06 Final
 
Session 04 Final Sua
Session 04 Final SuaSession 04 Final Sua
Session 04 Final Sua
 
Session 03 Final
Session 03 FinalSession 03 Final
Session 03 Final
 
Session 02 Final
Session 02 FinalSession 02 Final
Session 02 Final
 
Session 01 Final
Session 01 FinalSession 01 Final
Session 01 Final
 
Html overview
Html overviewHtml overview
Html overview
 
Ittlgc2
Ittlgc2Ittlgc2
Ittlgc2
 
Ittlgc3
Ittlgc3Ittlgc3
Ittlgc3
 
Ittlgc1
Ittlgc1Ittlgc1
Ittlgc1
 
Ittlgc
IttlgcIttlgc
Ittlgc
 
Baitap C
Baitap CBaitap C
Baitap C
 
Epc Assigment2
Epc Assigment2Epc Assigment2
Epc Assigment2
 
Epc Assignment1
Epc Assignment1Epc Assignment1
Epc Assignment1
 
Epc Assignment1 Vn
Epc Assignment1 VnEpc Assignment1 Vn
Epc Assignment1 Vn
 
Epc Assignment2 Vn
Epc Assignment2 VnEpc Assignment2 Vn
Epc Assignment2 Vn
 

Test

  • 1. E:test.html Sunday, August 23, 2009 11:10 PM Noi dung file c:test.css: body { text-align: center; } div.formContent { margin: 0 auto; text-align: left; width: 400px; } div.textElement { float: left; text-align: right; width: 100px; } div.inputElement { float: left; width: 298px; } Noi dung file c:test.html: <HTML> <HEAD> <link rel="stylesheet" type="text/css" href="test.css" /> <script> function kiemTraRong(tenDieuKhien, giaTri) { if (giaTri == "") { alert(tenDieuKhien + " phai co gia tri"); } } function kiemTraForm() { var hoaCanh = document.getElementById("hoaCanh"); if (hoaCanh.ten.value == "") { return ; } if (hoaCanh.diaChi.value == "") { return ; } if (hoaCanh.dienThoai.value == "") { return ; } if (hoaCanh.email.value == "") { return ; } if (hoaCanh.soLuong.value == "") { return ; } -1-
  • 2. E:test.html Sunday, August 23, 2009 11:10 PM if (hoaCanh.yeuCau.innerHTML == "") { return ; } hoaCanh.submit(); } </script> </HEAD> <BODY> <div class="formContent"> <form action="http://google.com" id="hoaCanh" > <div class="formElement"> <div class="textElement"> Ho ten: </div> <div class="inputElement"> <input type="text" name="ten" value="" onblur="kiemTraRong('Ho ten', this.value);" /><span>*</span> </div> <div class="clear" ></div> </div> <div class="formElement"> <div class="textElement"> Dia chi: </div> <div class="inputElement"> <input type="text" name="diaChi" value="" onblur="kiemTraRong('Dia chi', this.value);" /><span>*</span> </div> <div class="clear" ></div> </div> <div class="formElement"> <div class="textElement"> Dien thoai: </div> <div class="inputElement"> <input type="text" name="dienThoai" value="" onblur="kiemTraRong('Dien thoai', this.value);" /><span>*</span> </div> </div> <div class="formElement"> <div class="textElement"> Email: </div> <div class="inputElement"> <input type="text" name="email" value="" onblur="kiemTraRong('Email', this.value);" /><span>*</span> </div> </div> <div class="formElement"> <div class="textElement"> Loai hoa: </div> <div class="inputElement"> <select name="loaiHoa"> <option value="thuocduoc">Hoa thuoc duoc</option> <option value="hoahong">Hoa hong</option> -2-
  • 3. E:test.html Sunday, August 23, 2009 11:10 PM </select> Mau: <select name="mau"> <option value="do">Do</option> <option value="hong">Hong</option> </select> </div> </div> <div class="formElement"> <div class="textElement"> So luong: </div> <div class="inputElement"> <input type="text" name="soLuong" value="" onblur="kiemTraRong('So luong', this.value);" /><span>*</span> </div> </div> <div class="formElement"> <div class="textElement"> Don vi tinh: </div> <div class="inputElement"> <input type="radio" name="donVi" value="nhanh" />Nhanh <input type="radio" name="donVi" value="bo" />Bo <input type="radio" name="donVi" value="chau" />Chau </div> </div> <div class="formElement"> <div class="textElement"> Thanh toan: </div> <div class="inputElement"> <input type="radio" name="thanhToan" value="tienMat" />Tien mat <input type="radio" name="thanhToan" value="chuyenKhoan" />Chuyen khoan <input type="radio" name="thanhToan" value="sec" />Sec </div> </div> <div class="formElement"> <div class="textElement"> Yeu cau </div> <div class="inputElement"> <textarea name="yeuCau" onblur="kiemTraRong('Yeu cau', this.innerHTML);" > </textarea> </div> </div> <div class="formElement"> <div class="textElement"> </div> <div class="inputElement"> <input type="button" value="Dang ky" onclick="kiemTraForm();" /> <input type="reset" value="Xoa thong tin" /> </div> </div> </form> </div> </BODY> -3-
  • 4. E:test.html Sunday, August 23, 2009 11:10 PM </HTML> -4-