Tra Từ Điển

Thời gianTiếtThứ 2Thứ 3Thứ 4Thứ 5Thứ 6
8g40 - 9g101Tiếng Việt
Tiếng Anh
Tiếng Việt
Tiếng Việt
9g10 - 9g302Nghỉ giải lao
Tiếng Anh
Nghỉ giải lao
Nghỉ giải lao
9g30 - 10g3Toán
Toán
Toán
Showing posts with label JavaScript. Show all posts
Showing posts with label JavaScript. Show all posts

Saturday, November 13, 2021

JavaScript - Ngày 7

Untitled Document
Đăng ký du lịch
Họ và Tên

Địa chỉ
Điện thoại
Khách Việt Nam
Chọn tour
Phương tiên


Số lượng đoàn khách
Ghi chú thêm

Thông báo sẽ hiển thị ở đây!
//Code
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<script type="text/javascript">
function kiemtra()
{
if(document.getElementById("hoten").value=="")
document.getElementById("thongbao").innerHTML="Họ tên không được để trống!";
else if(document.getElementById("diachi").value=="")
document.getElementById("thongbao").innerHTML="Địa chỉ không được để trống!";
else
document.getElementById("thongbao").innerHTML="Bạn đã đăng ký thành công!!!";
}
</script>
<form id="form1" name="form1" method="post">
  <table width="800" border="1" cellspacing="0" cellpadding="0" align="center">
    <caption>
      Đăng ký du lịch
    </caption>
    <tbody>
      <tr>
        <td width="121">Họ và Tên</td>
        <td width="373">
        <input name="hoten" type="text" id="hoten" size="60"></td>
      </tr>
      <tr>
        <td><p>Địa chỉ</p></td>
        <td>
        <input name="diachi" type="text" id="diachi" size="45"></td>
      </tr>
      <tr>
        <td>Điện thoại</td>
        <td>
        <input name="dienthoai" type="text" id="dienthoai" size="20"></td>
      </tr>
      <tr>
        <td>Khách Việt Nam</td>
        <td><input name="checkbox" type="checkbox" id="checkbox" checked></td>
      </tr>
      <tr>
        <td>Chọn tour</td>
        <td>
          <select name="chontour" id="chontour">
  <option value="1">Buôn mê thuột - Gia Lai - Kontum</option>
      <option value="2">Sài gòn - Đà Lạt</option>
        </select></td>
      </tr>
      <tr>
        <td>Phương tiên</td>
        <td><p>
          <label>
            <input type="radio" name="phuongtien" value="1" id="phuongtien_0">
            Máy bay</label>
          
          <label>
            <input name="phuongtien" type="radio" id="phuongtien_1" value="2" checked>
            Xe ô tô</label>
          <br>
        </p></td>
      </tr>
      <tr>
        <td colspan="2" align="center"><fieldset style="width: 70%;">
          <legend>Số lượng đoàn khách</legend>
          <label for="nguoilon">Người lớn:</label>
          <input name="nguoilon" type="text" id="nguoilon" size="10"> 
          <label for="treem">Trẻ em::</label>
          <input name="treem" type="text" id="treem" size="5">
        </fieldset></td>
      </tr>
      <tr>
        <td>Ghi chú thêm</td>
        <td>
        <textarea name="ghichu" rows="2" id="ghichu"></textarea></td>
      </tr>
      <tr>
        <td colspan="2" align="center"><input type="button" name="dongy" id="dongy" value="Đồng ý" onClick="kiemtra();"></td>
      </tr>
      <tr>
  <td colspan="2"><p id="thongbao" align="center">Thông báo sẽ hiển thị ở đây!</p></td>
      </tr>
    </tbody>
  </table>
</form>
</body>
</html>

Chi tiết

Friday, November 12, 2021

Tên, tuổi, lời chào - JavaScript - Ngày 6

Untitled Document

//Code

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
#abc{color: red; font-weight: bold;}
</style>
</head>

<body>
<script type="text/javascript">
function chao(ts1, ts2)
{
ngay=new Date();
namht=ngay.getFullYear();
alert(namht);
tuoi=namht-parseInt(ts2);
document.getElementById("kq").innerHTML="Chào bạn <span id='abc'>"+ts1+"</span>. Hiện nay bạn đang "+tuoi+" tuổi";
}
</script>
<form id="form1" name="form1" method="post">
  <p>
    <label for="ten">Tên: :</label>
    <input type="text" name="ten" id="ten">
  </p>
  <p>
    <label for="namsinh">Năm sinh:</label>
    <input type="text" name="namsinh" id="namsinh">
  </p>
  <p>
    <input type="button" name="thuchien" id="thuchien" value="Thực hiện" onClick="chao(ten.value, namsinh.value)">
  </p>
</form>
<p id="kq"></p>
</body>
</html>
 

Chi tiết

Thursday, November 11, 2021

JavaScript - Kiểm tra form flogin - Kiểm tra form search - Dò độ phân giải

Chi tiết

Saturday, November 6, 2021

LAB JAVASCRIPT

LAB JAVASCRIPT

1.     Kiểm tra form flogin

-        Tạo form  như sau: .

// File login.html

<form id="flogin" name="flogin" method="post" action="xulylogin.html">

Username:<br/> <input name="u" id="u" type="text" /> <br/>

Password:<br/> <input name="p" id="p" type="password"/> <br/>

<input type="submit" name="sub" id="sub" value="Login" />

</form>

 

-        Tạo file javaScript checklogin.js

function checklogin(){

     if(document.flogin.u.value==''){

           alert("Bạn chưa nhập username");

           document.flogin.u.focus(); //Chọn đối tượng u

          return false;   // Chặn form không cho submit

     }

     if(document.flogin.p.value=='') {

           alert("Bạn chưa nhập password");

           document.flogin.p.focus(); //Chọn đối tượng p

           return false;  

     }   

     return true; // Cho submit form khi đã kiểm tra xong

}

 

-         Chèn file checklogin.js vào file login.html và gọi hàm kiểm tra form như sau:

<head>

<script type="text/javascript" src="checklogin.js"></script>

</head>

<body>

<form onsubmit="return checklogin();" id="flogin" name="flogin" method="post" action="xulylogin.php">

2.      Kiểm tra form search

-        Tạo form sau:

<form id=formtim name=formtim action="kqtim.html" method="get">

<input  name="tukhoa" id="tukhoa" type="text"  value="Tìm kiếm"/>   

<input  name="btntim" id="btntim" type="submit" value=" TÌM "/>   

</form>

-        Chọn text field tukhoa è vào code và thêm code như sau.

<input onclick="if(this.value=='Tìm kiếm') this.value=''" onblur="if(this.value=='') this.value='Tìm kiếm'" name="tukhoa" id="tukhoa" type="text" value="Tìm kiếm" />   

 

-        Viết hàm kiểm tra form search

// file checksearch.js

function checksearch (){

     if(document.formtim.tukhoa.value=='Tìm kiếm')    {

           alert("Bạn chưa nhập từ khóa tìm kiếm…");  

           document.formtim.tukhoa.focus();     

           return false;   // Chặn form không cho submit

     }         

     return true; // Cho submit form khi đã kiểm tra xong

}

 

-        Chèn file checksearch.js và gọi hàm kiểm tra form như sau:

<head>

<script type="text/javascript" src="checksearch.js"></script>

</head>

<body>

<form onsubmit="return checksearch();" id="formtim" name="formtim" action="kqtim.html" method="get">

3.     Dò độ phân giải 

Dò độ phân giải để chuyển cho user trang web thích hợp với độ phân giải của họ

<script type="text/javascript">
if (screen.width==800) document.location='index1.html';
else if (screen.width==1024) document.location='index2.html';
else document.location='index3.html';
</script>

4.     Dò browser của user

Dò browser để chuyển cho user trang web thích hợp

<script type="text/javascript">

if (navigator.userAgent.indexOf('MSIE')>0) document.location='index1.html';

else if (navigator.userAgent.indexOf('Firefox')>0) document.location='index2.html';

else document.location='index3.html';

</script>

5.     Hiện giờ hiện hành

<script type="text/javascript">

function tg(){

var currentTime = new Date();

var month = currentTime.getMonth() + 1;

var day = currentTime.getDate();

var year = currentTime.getFullYear();

var hour = currentTime.getHours();

var minutes = currentTime.getMinutes();

var seconds = currentTime.getSeconds();

document.getElementById("dongho").innerHTML = day + "/"  + month  +

 "/" + year + " " + hour + ":" + minutes+":"+seconds;

}

setInterval("tg()",1000);

</script>

<span id="dongho"></span>

6.     Đếm giảm dần để chuyển trang

<script>

var sogiay=5;

setTimeout("document.location='index.html", sogiay *1000);

setInterval("document.getElementById('sogiay').innerHTML=sogiay--",1000);

</script>

 

<center>

<p> Đã thực thi xong </p>

<p><a href='index.html>Quay lại trang chủ</a></p>

<P>Sẽ quay lại trang chủ sau <span id="sogiay"></span> &nbsp;giây nữa

</center>

7.     Mở đóng window

a.      Tạo trang a.html, gõ trong body:

<style>

.do{ background-color:#993333}

.xanh{ background-color:#0099FF}

</style>

<script>

function openWin(){

w = window.open('b.html','CSMoi','width=300,height=150,menubar=no,

toolbar=no,left=250,top=150');

w.focus();

}

</script>

 

<input type="button" onclick="openWin()" value="Mở window" />

b.     Tạo trang b.html, gõ trong body:

<p align="center">Đổi màu window cha</p>

<p align="center">

<input type="button" value="Màu đỏ" onclick="chuyenmau('do')"/> &nbsp;

<input type="button" value="Màu xanh" onclick="chuyenmau('xanh')" />

</p>

 

<p align="center">

<a href="#" onclick="window.close()">Đóng</a>

</p>

 

<script>

function chuyenmau(mau){

window.opener.document.body.className=mau;

}

</script>

c.      Test

 

Chi tiết

Bài tập 3 - tạo bảng màu

Untitled Document

//Code
<html>
<head>
<meta charset="utf-8"></meta>
<title>Untitled Document</title>
</head>

<body>
<script type="text/javascript">
function tbang(ts1,ts2,ts3)
{
tam="<table border='1' width='80%' bgcolor='"+ts3+"'>";
for(i=1;i<=ts1;i++)
{
tam+="<tr>"; //là phép gán rút gọn của: tam=tam+"<tr>";
for(j=1;j<=ts2;j++)
tam+="<td>&nbsp;</td>";
tam+="</tr>";
}
tam+="</table>";
document.getElementById("kq").innerHTML=tam;
}
</script>
<form id="form1" method="post" name="form1">
  <p>
    <label for="dong">Số dòng:</label>
    <input id="dong" name="dong" type="text" />
  </p>
  <p>
    <label for="cot">Số cột:</label>
    <input id="cot" name="cot" type="text" />
  </p>
  <p>
    <label for="mau">Chọn màu::</label>
    <select id="mau" name="mau">
<option value="blue">Xanh dương</option>
<option value="red">Đỏ</option>
<option value="yellow">Vàng</option>
    </select>
  </p>
  <p>
    <input id="taobang" name="taobang" onclick="tbang(dong.value,cot.value,mau.value);" type="button" value="Tạo bảng" />
  </p>
</form>
<p id="kq"></p>
</body>
</html>

Chi tiết

Friday, November 5, 2021

Tính tổng, hiệu, tích, thương - Hàm JavaScript

Untitled Document

//Code

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript">
function tong(a,b)
{
a=parseInt(a);
b=parseInt(b);
document.getElementById("kq").value=a+b;
}
function hieu(a,b)
{
a=parseInt(a);
b=parseInt(b);
document.getElementById("kq").value=a-b;
}
function tich(a,b)
{
a=parseInt(a);
b=parseInt(b);
document.getElementById("kq").value=a*b;
}
function thuong(a,b)
{
a=parseInt(a);
b=parseInt(b);
document.getElementById("kq").value=a/b;
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post">
  <p>
    <label for="so1">Số 1::</label>
    <input type="text" name="so1" id="so1">
  </p>
  <p>
    <label for="so2">Số 2::</label>
    <input type="text" name="so2" id="so2">
  </p>
  <p>
    <label for="kq">Kết quả::</label>
    <input type="text" name="kq" id="kq" disabled>
  </p>
  <p>
    <input type="button" name="tinhtong" id="tinhtong" value="Tính Tổng" onClick="tong(so1.value,so2.value)">
    <input type="button" name="tinhhieu" id="tinhhieu" value="Tính Hiệu" onClick="hieu(so1.value,so2.value)">
    <input type="button" name="nhan" id="nhan" value="Tích" onClick="tich(so1.value,so2.value)">
    <input type="button" name="chia" id="chia" value="Thương" onClick="thuong(so1.value,so2.value)">
  </p>
</form>
</body>
</html>

Chi tiết

Thursday, November 4, 2021

Bài tập 2 - Tạo bảng - Hàm Javascript

Untitled Document

//Code

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<script type="text/javascript">
function tbang(ts1,ts2)
{
tam="<table border='1' width='80%'>";
for(i=1;i<=ts1;i++)
{
tam+="<tr>"; //là phép gán rút gọn của: tam=tam+"<tr>";
for(j=1;j<=ts2;j++)
tam+="<td>&nbsp;</td>";
tam+="</tr>";
}
tam+="</table>";
document.getElementById("kq").innerHTML=tam;
}
</script>
<form id="form1" name="form1" method="post">
  <p>
    <label for="dong">Số dòng:</label>
    <input type="text" name="dong" id="dong">
  </p>
  <p>
    <label for="cot">Số cột:</label>
    <input type="text" name="cot" id="cot">
  </p>
  <p>
    <input type="button" name="taobang" id="taobang" value="Tạo bảng" onClick="tbang(dong.value,cot.value);">
  </p>
</form>
<p id="kq"></p>
</body>
</html>

Chi tiết

Bài tập 1 - tính tổng - Hàm Javascript

Untitled Document

_________________
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript">
function tong()
{
a=parseInt(document.getElementById("so1").value);
b=parseInt(document.form1.so2.value);
tam=a+b;
document.getElementById("kq").value=tam;
}
function tong2(a,b)
{
a=parseInt(a);
b=parseInt(b);
document.getElementById("kq").value=a+b;
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post">
  <p>
    <label for="so1">Số 1::</label>
    <input type="text" name="so1" id="so1">
  </p>
  <p>
    <label for="so2">Số 2::</label>
    <input type="text" name="so2" id="so2">
  </p>
  <p>
    <label for="kq">Kết quả::</label>
    <input type="text" name="kq" id="kq" disabled>
  </p>
  <p>
    <input type="button" name="tinhtong" id="tinhtong" value="Tính Tổng" onClick="tong2(so1.value,so2.value)">
  </p>
</form>
</body>
</html>

Chi tiết

tam=document.getElementById("p1").innerHTML

Untitled Document

Đoạn 1

Chi tiết

Áp dụng Hàm

Untitled Document

Chi tiết

if-else

Untitled Document

Chi tiết

Tạo 1 bảng gồm 5 dòng, 7 cột

Javascript

Chi tiết

Các loại HÀM Javascript - Xây dựng hàm in ra bảng cửu chương thứ n. Áp dụng hàm vừa xây dựng để in bảng cửu chương 2 và bảng cửu chương 9

// JavaScript Document
//Xây dựng các function ở đây:
//Hàm không có tham số: Thường dùng để đưa ra 1 thông báo cố định cho người dùng
function tb1()
{
document.write("Xin chào bạn. Chúc bạn một ngày vui vẻ!");
}
//Hàm có tham số và không return: Kết quả tùy thuộc vào tham số đưa vào.
function tb2(ts)
{
document.write("Xin chào "+ts+". Chúc "+ts+" một ngày vui vẻ!");
}

//Hàm có tham số và có return: 
//Xây dựng hàm nhận 1 chuỗi và trả về chuỗi ở dạng in đậm và nghiêng:
function dn(str)
{
tam="<b><i>"+str+"</i></b>";
return tam;
}

//Hàm tính bình phương của 1 số:
//- hàm có tham số và không có return: function bp1(ts)
function bp1(ts)
{
tam=ts*ts;
document.write(tam);
}
//- Hàm có tham sô và có return: function bp2(ts):
function bp2(ts)
{
tam=ts*ts;
return tam;
}

//Xây dựng hàm tính x^n:
function tinhmu(x,n)
{
//Ví dụ: x^3=1*x*x*x
//x^n: 1*x*x....*x
tam=1;
for(i=1;i<=n;i++)
{
tam=tam*x; // 1: tam=1*x; 2: tam=x*x; 3: tam=x*x*x
}
return tam;
}
//Xây dựng hàm in ra bảng cửu chương thứ n. Áp dụng hàm vừa xây dựng để in bảng cửu chương 2 và bảng cửu chương 9.

function in_bcc(n)
{
for(i=1;i<=10;i++)
document.write(n+" x "+i+" = "+(n*i)+"<br/>");
}
//Xây dựng hàm in các bảng cửu chương từ 1-9:
function bcc()
{
document.write("<table border='1' width='80%'><tr>");
for(j=1;j<=9;j++)
{
document.write("<td>");
for(i=1;i<=10;i++)
document.write(j+" x "+i+" = "+(j*i)+"<br/>");
document.write("</td>");
}
document.write("</tr></table>")
}

Chi tiết

Tuesday, November 2, 2021

Bài tập 1 - Javascript - TÍNH TỔNG

Untitled Document

Chi tiết

Sự Kiện - Javascript

Untitled Document

Đoạn 1

________________
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript">
function laynd()
{
tam=document.getElementById("p1").innerHTML;
alert(tam);
document.getElementById("p1").innerHTML="Nội dung đã thay đổi!";
}
function laygt()
{
tam=document.form1.test1.value;
alert("Giá trị của ô test1 là:"+tam);
document.form1.thuchien.value=" Action ";
}
</script>
</head>

<body>
<p id="p1" onClick="laynd();">Đoạn 1</p>
<hr/>
<form id="form1" name="form1" method="post">
  <label for="test1">Nhập giá trị:</label>
      <input type="text" name="test1" id="test1" value="abc">
      <input type="button" name="thuchien" id="thuchien" value="Thực hiện" onClick="laygt()">
</form>
</body>
</html>

Chi tiết

Saturday, October 30, 2021

Áp dụng Hàm Javascript - Ngày 2

Untitled Document

Chi tiết