WELCOME TO BLOGGER VQGĐC

THÂN CHÀO QUÝ BẠN
CLICK HERE TO OPEN

Tất cả hình ảnh, những hoạt động cùng cơ sở Định Chuẩn rồi cũng cùng với thời gian rơi vào khoảng không
Nếu còn gì rớt lại chỉ là những tình cảm của những con người đã một thời làm việc chung dưới một mái nhà
mà nay đả tản mác khắp bốn phương trời
Ninh Vũ / Phòng Thí Nghiệm VQGĐC

Sunday, September 22, 2024

KẾT HỢP FORM VỚI FUNCTION VÀ IF... ELSE TRONG MỘT PROGRAM

 

PROGRAM KẾT HỢP FORM VỚI FUNCTION VÀ IF... ELSE

 Thí dụ dúng nhiều chữ if... else và html form để viết một program ra lịnh cho bốn thành phần nhân dân phải thi hành trong thời chiến tranh.

1-Lớp tuổi từ  25 tới 30. Phải nhập ngủ.

2-Lớp tuỗi từ  31 tới 40. Phải học vỏ tự vệ.

3-Lởp tuối nhỏ hơn 25. Phải đi học.

4-Lớp tuỗi còn lại lo xây dựng sản xuất để xuất khầu.

  ----------------

<html><body>

     <script>

   function display(x){

      if(x>=25 && x<=30){alert("TRÌNH DIỆN NHẬP NGỦ")}                   

      else if(x>=31 && x<=40){alert("HỌC VỎ TỰ VỆ")}

      if(x<25){alert("Must go to school")}

      else {alert(" LO XÂY DỰNG  SÃN XUẤT ĐỂ XUẤT KHẨU")}

      }

    </script>

    <form>

   <input type="text" name="baxao" value= " "

    style="height:60px; width:200px;"/><br><br>                    

  <button onclick="display(form.baxao.value)">CLICK</button>

    </form>

   </body></html>

---------------------

Ghi chú.

Tại sao phải dùng form của html ?

-Vì cần phải đưa vao function nhiều con số khác nhau thí dụ x=20, x=50 v.v...thì phài dùng form.

-Vì alert viết trong phạm vi của function chỉ hiển thị các con số do function chuyên tới mà thôi .

-Muốn alert hiển thị chư viết thì phải kèm thêm phương pháp phức tạp .

Tên của form có thể tự minh đặt ra tuỳ ý.

Thí dụ name ="baxao"

Muốn cho function display(x) vận hành thì phải viết như sau.

<button onclick="display(form.baxao.value)">CLICK</button> 

Ba chữ form, baxao, value phải dính nhau bằng dấu chấm theo phương pháp của DOM gọi la Document Object Model.


Friday, September 20, 2024

XỪ DỤNG LIÊN TỤC if else, else if, else, if else.

THÍ DỤ XỪ DỤNG LIÊN TỤC if else, else if, else, if else.

THÍ DỤ 1.

 CHỈ ĐƯA RA MỘT ĐIỀU KIÊN YÊU CẦU FUNCTION CHO BIẾT ĐÚNG HAY KHÔNG KHI NHÌN CÁC CON SỐ.

   <html><body>

   <script>

  function display(){

    var x1=15

    var x2=10

    var x3=20

    if(x1==x2){alert("ĐÚNG nếu thấy có")}

    else{alert("XAO KE nếu không thấy cọ")}

    }

  </script>

 <span onclick="display()">CLICK</span>

  </body> </html>

GHI CHÚ’

1-Sau chữ if và else nếu cọ hai hàng codes thỉ phải dùng dấu curly braces { }.

Nếu chỉ có một hàng thì không cần dấu curly braces.

2-Phải viêt như sau  x1==x2 thì cho kết quả đúng nếu function thấy có trong các con số trên.

Không viết  x1=x2 vì function cho kết quả sai .

Dấu == có nghía là equal symbol và cũng có nghĩa là “It has a value”

Dấu && có nghĩa là “and 

THÍ DỤ 2.

Đưa ra hai điều kiện yêu cầu function display() cho biết đúng hay không đúng.

    <html><body>

    <script>

  function display(){

    var x1=15

    var x2=10

    var x3=20   

    if(x1==x2){alert("ĐÚNG")}

    else if(x1<x2){alert("XẠO KE")}

    else{alert("KHÔNG CÓ GÌ ĐÚNG")}

    }

  </script>

 <span onclick="display()">CLICK</span>

  </body> </html>

GHI CHÚ.

Điều kiện đầ̀u tiên ví x1 và x2 không bằng nhau nên function trả lời không đúng.

Điều kiện thứ hai không có x1 nhỏ hơn x2 nên function trả lời theo ý kiến của chúng ta muốn viết cho vui là xạo ke.

Rồi cuối cùng function cho biết không có gi đúng theo như chúng ta đã thấy trên bản mà chúng ta đã viết

THÍ DỤ  3.

Đưa ra ba điều kiên như sau.

   <html><body>

    <script>

  function display(){

    var x1=15

    var x2=10

    var x3=20

    if(x1==x2){alert("VIẾT XÁC NHÂN ĐÚNG NẾU THẤY CÓ")}

    else if(x1<x2){alert(" VIỄT KHÔNG ĐÚNG NẾU THẤY CÓ")}

    else{alert("VIẾT KHÔNG CÓ GÌ ĐÚNG VỚI HAI ĐIỀU KIÊN TRÊN")}

    if(x3>x2){alert("OK XÁC NHÂN ĐÚNG NẾU NHÌN THẤY CÓ")}

    else {alert(" MONG HỌC GIỎI CÓ NGHÊ BẢO VỆ TỔ QÙỐC")}

     }

  </script>

 <span onclick="display()"><center>CLICK</span>

  </body> </html>

Ghi chú.

Nếu muốn xuất hiện câu : "MONG HỌC GIỎI CÓ NGHÊ B̉ÀO VỆ T̉Ổ QUÔC"

Thi viết x1>x3 thay cho x3>x2

Wednesday, September 11, 2024

SMIL LÀM DI ĐỘNG HÌNH VẼ SVG

SMIL LÀM HÌNH SVG CHUYỂN ĐỘNG

SMIL nghĩa là Synchronized Multimedia Integration xuất hiện version đầu tiên vào năm 1998. Với version 2.1 năm 2005 có nhiều động tác làm di chuyển hinh SVG.

1-  animate attributeName làm di chuyển hình svg theo trục x, hoặc trục y .

2- animateMotion làm di chuyển hình svg theo tọa độ x,y .

Rất đơn giản không cần Javascript. Viết động tác làm di chuyển trong phạm vi của hình. Viết thời gian di chuyển , ấn định chỗ khởi hành và chỗ ngừng lại rồi cho lặp lại số lần di chuyển.

Muốn khởi hành và ngừng lại theo y muốn thì viết codes cho nút start và stop.

  -----------------------------------------------------------

A-XỬ DÚNG ĐỘNG TÁC animate attributeName.

Đây là thí dụ làm hình svg chuyển động trên trục x từ vị trí 60 pxels tới vị trí 160 pixels.

Hình di chuyển liên tục không ngừng lại. Muốn ngừng phải tạo nút STOP.

Thị dụ 1.

<svg  xmlns="http://www.w3.org/2000/svg" width="5000" height="3000">           

<circle cx="50" cy="150" r="20" stroke="red" fill="blue">

<animate attributeName="cx" dur="4" from="60" to="160"

repeatCount="indefinite"/>

</circle>

</svg>

Thí du 2.

<svg  xmlns="http://www.w3.org/2000/svg" width="5000" height="3000">           

  <circle cx="50" cy="150" r="20" stroke="red" fill="blue">

  <animate

   attributeName="cx"// viết riêng chữ animate

   begin="0s" dur="4" // viểt thêm chữ begin

   from="60"

   to="160"

   repeatCount="indefinite"/>

  </circle>

  </svg>

B-XỬ DỤNG ĐỘNG TÁC animateMotion

 Động tác goị là animateMotion của SMIL làm hinh svg chuỷển đông theo tọa độ từ điểm nầy sang điểm khác như sau.

Thí dụ.

 <svg  xmlns="http://www.w3.org/2000/svg" width="5000" height="3000">                 

<circle cx="50" cy="150" r="20" stroke="red" fill="blue">

<animateMotion dur="4" from="60,100" to="150,200"

repeatCount="indefinite"/>

</animateMotion>

</circle>

</svg>

Hình di chuyển liên tục không ngừng lại. Muốn ngừng phải tạo nút STOP

TẠO NÚT START VÀ STOP.

<svg  xmlns="http://www.w3.org/2000/svg" width="5000" height="3000">                     

<g id="1">

<circle cx="50" cy="150" r="20" stroke="red" fill="blue">

<animateMotion begin="B.click" end="S.click"  dur="4" from="60,100" to="150,200"

repeatCount="indefinite"/>

</circle>

        <g id="B">

        <text x="20" y="120" fill="blue">START</text></g>

        <g id="S">   

        <text x="100" y="120" fill="red">STOP</text></g>

 </g>

</svg>

 


Tuesday, September 10, 2024

HOC VẼ HÌNH THEO SVG RẤT HAY.

HỌC VẼ HÌNH BẰNG SVG RẤT HAY.

svg nghĩa là Scalable Vector Graphic

Phương pháp nầy dạy vẽ những hình rất nhẹ hơn hỉnh gif, png.

Khi kéo hình lớn ra hoặc thu nhỏ lại theo ý muốn, hình không bị hư lệch.

Loaị hình vè nâỳ rất hay, được xử dụng rất phổ thông khi muốn tạo hình di chuyển.

Bài kế tiếp “Cách Làm Hình SVG Chuyển Động Trên Quỷ Đạo”

                         ----------------------

Phương pháp SVG nầy xuất hiện vào năm1998 và thành tiêu chuẩn quốc tế năm 2000 cho nên câu đầu tiên và cuối bảng vé phải viết như sau thì hình mới xuất hiện.

 <svg  xmlns="http://www.w3.org/2000/svg" width="5000" height="3000">

</svg>

Trong câu đầu tiên phải có kích thước tự do chọn cho chiều rộng và chiều cao của view port tính theo pixels. Hình vẽ sẽ phải nằm trong view port.

Cuối bảng vẽ phải có dấu chấm dứt lã </SVG>. 

Thí dụ thực hành.
Trước tiên vẽ hinh chử nhật rồi vẽ một đường thẳng và một vòng tròn. Tất cả đều được tô màu        

Mở notepad rồi viết như sau.

(Copy rồi paste vào Notepad) 

<svg  xmlns="http://www.w3.org/2000/svg" width="5000" height="3000">       

    <rect x="150" y="100" width="200" height="150" stroke="blue" fill="aqua"/>//phải có dấu chận

    </rect>

    <line  x1="250" y1="150" x2="300" y2="200" stroke-width="4" stroke="red"/> // phải có dấu chận

    <circle cx="300" cy="150" r="20" stroke="red" fill="blue"

    </circle>

</svg>

------------------------

Ghi chú .

Không cần dùng html. Cần ấn định kich thước của khung vẽ gọi là view port đo bằng pixels theo default .

Ấn định tọa độ x,y của hình và ấn định kích thước của hình tuỳ ý.

Tung độ phải đo theo chiều âm.

Đường thẳng có toạ độ của điểm khởi hành x1,y1 và điểm cuối x2,y2

Vong tròn có tọa độ của tâm là cx, cy và bán kinh r

Save tức là tồn trử bảng vẽ bằng cách viết như sau   SVG RECT.html. Hình sẽ được tồn trử trong document của computer.

Chuyền hình tử document ra desktop thì tạo desktop shortcut rôi dung Browser Google mở xem.

MUỐN VIẾT CHỮ TRONG SVG THÌ VIẾT NHƯ SAU.

<svg xmlns="http://www.w3.org/2000/svg" width="5000" height="3000">            

    <rect x="150" y="100" width="200" height="150" stroke="blue" fill="aqua"/>//phải có dấu chận

    </rect>

    <line  x1="250" y1="150" x2="300" y2="200" stroke-width="4" stroke="red"/> // phải có dấu chận

    <circle cx="300" cy="150" r="20" stroke="red" fill="blue"/>phaỉ có dậu chận để phân dưới hiện ra

    </circle>

    <text x="80" y="300" font-size="30" font-family="arial" fill="red">THÂN CHAO QUÝ BẠN</text>

</svg>



 

Wednesday, September 4, 2024

BẤM NÚT PROGRAM JAVASCRIPT CHỈ CỔNG VAÔ LỚP HỌC.

PROGRAM  JAVASCRIPT DÙNG confirm, if...else

ĐỂ CHỌN CỔNG VÀO LỚP HỌC.

             

 

<html><body>

  <script>

      function openGate(){   

         if (confirm("HỌC SINH CỦA TRƯƠNG : \n BẤM OK \n"+

                       "KHÔNG PHÂỈ : \n BẤM HỦY")){

         alert("BÊN PHẢI CỔNG SỐ 1")}

         else{alert("BÊN TRÁI LÀ CỔNG SỐ 2\n" + "KHU QUẢN TRỊ")}

                    }

  </script>

           <span onclick="openGate()">CLICK</span>     

</body></html>

--------

GHI CHÚ.

Trong confirm () window.

Muốn viết xuống hàng thì viết  \n

Muốn viết thêm nhiều câu nữa thì viết dấu công +

Những câu viết phải nằm giữa dấu ngoặc “....”

 Chữ else dùng dấu curly {... }

Sunday, September 1, 2024

HOÃ ĐƠN ĐƠN GIẢN THEO NESTED FUNCTION VÀ RETURN.

Xử dụng nested function và chữ return để viết hoá đơn theo Javascript.

function() bi chứa trong một function() khác được  gọi nested function, còn được gọi là function inner .

 Dùng return để call function inner và return phài viết trong  function inner. Nếu không call sẽ bị undefined

                         -------- 

Viết javaScript program dùng nested function và return statement như sau.

Cần nhớ.

Nested function có thể xử dụng variables của outer function nhưng outer function không thể xử dụng variables của nested function.

Đó là một lý do có nhiều người thích dùng nested function để viết JavaScript program như thí dụ nầy.
Đây là một JavaScript program đơn giản viết thành hoá đơn  của một cửa hàng bán mè xửng Huế tại Bolsa đông khách.

Chúng ta có thể đem ra ngoài các variables của function inner() để đặt trong function outer() ngoại trừ var total  không thể đem ra ngoài.

Lỵ do function inner() có thể access tất cả các variables và parameters của function outer().

Còn function outer không thể xứ dụng variables của function inner.

Vậy phải call function inner ở trong nó thì hoá đơn mới xuất hiện .

Nếu chúng ta chỉ call  function outer thì function inner sẽ không hoạt động-Chỉ xuất hiện undefined

Thí dụ đầy có đủ hai functions

<script>

    function outer(x1, x2, x3, x4) {
         var str1= '100g meXung';
         var unitprice = 1.99;
         var quantity = 
parseInt(prompt('Bạn muốn mua bao nhiêu kẹo mè xửng?'));
         var currency= 'USD';   

   
function inner(x3, x4) {
                 var totalparseFloat(x2*x3);
                 return('Tên món hàng'+':'+ str1 +'\n'
                  +'Giá đơn vị'+':'+ unitprice +'\n'
                  + 'Số lượng'+':'+ quantity +'\n'
                  +'Tổng cộng'+':'+ total +' '+ currency);
      }
                 return inner(quantity,'USD') // phải call function inner bằng cách dùng return mới vận hành.
      }
  alert(outer('100g meXung', 1.99 ,'USD'))// call function outer ở ngoài function outer.

</script>

------------------------------

Ghi Chú.

1-Phải call function inner ở trong function inner.

 2-Phải call function outer ở ngòai function outer.

 3-var total phải viết trong function inner.Không viết trong function outer.

Đâylà hoá đơn xuất hiện.