Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống
1
/ 52 trang
THÔNG TIN TÀI LIỆU
Cấu trúc
CHƯƠNG XVII(tt)
Đối tượng form
PowerPoint Presentation
Slide 4
Slide 5
Các thuộc tính trên mảng element
Slide 7
Slide 8
Slide 9
Các phần tử trên form
Slide 11
Slide 12
Slide 13
Slide 14
THAY ĐỔI NỘI DUNG ĐỘNG TRÊN TRANG
Slide 16
Slide 17
Slide 18
Slide 19
Slide 20
CHƯƠNG XVIII
FILTER
Slide 23
Slide 24
Slide 25
Slide 26
Slide 27
Slide 28
Slide 29
Slide 30
Slide 31
Slide 32
Slide 33
Slide 34
Slide 35
Slide 36
Slide 37
Slide 38
Slide 39
Slide 40
TRANSITION
Slide 42
Slide 43
Slide 44
Slide 45
Slide 46
Slide 47
Slide 48
Slide 49
Slide 50
Slide 51
Slide 52
Nội dung
CHƯƠNG XVII(tt) MÔ HÌNH ĐỐI TƯỢNG I. Đối tượng form Form là một thành phần dùng để thu thập dữ liệu, thông tin từ người dùng. Mỗi phần tử trong form là một đối tượng trong DOM. Do đó mỗi phần tử trên form cũng có những sự kiện và phương thức của nó a) Các sự kiện của các phần tử trên form . Phần tử Tên sự kiện Button onClick Checkbox onClick Form OnSubmit, onReset Textbox OnBlur,OnChange,OnFocus,Onselect Radio OnClick Reset button OnClick Dropdown menu OnBlur,onChange,onFocus,onSelect Submit button OnClick Textarea OnBlur,OnChange,OnFocus,Onselect T/tính Mô tả Ví dụ Action Trả về đường dẫn (URL) đến tập tin xử lý của form thứ i Document.forms[i].action Length Trả về số form trên trang web Hoặc trả về số phần tử trên form thứ i Countform=document.forms.length Countfield=document.forms[i].length Name Trả về giá trị tên của form thứ i Nameform=document.forms[i].name Method Các định phương thức của form thứ i Methodform=document.forms[i].method elements mảng element chứa các phần tử trên form document.forms[i].elements[j].value 2. Thuộc tính của form Ví dụ: <script> function kq() { sptform=document.form1.length document.form1.spt.value=sptform tenform=document.forms[0].name document.form1.formname.value=tenform } </script> 3. Các thuộc tính trên mảng element T/ tính Mô tả Ví dụ Name Xác định tên của phần tử j trên form thứ i. document.forms[i].elements[j].name Type Xác định lọai của đối tượng document.forms[i].elements[j].type Value Xác định giá trị của phần tử thứ j trong form i. document.forms[i].elements[j].value Checked Xác định phần tử thứ j có được checked không document.form[i]. elements[j].checked trả về giá trị true hoặc false Disabled Thiết lập chế độ vô hiệu hóa đối tượng document.form[i].elements[j]. disabled isDisable Kiểm tra phần tử có bị vô hiệu hóa hay không document.form[i].elements[j]. isDisable readOnly Cho phép/không thay đổi nội dung của phần tử document.forms[i].elements[j] .readOnly Ví dụ: function loadform() { document.form1.ok.disabled=true; } function validateform() { a=document.form1.user.value; if(a!="") document.form1.ok.disabled=false; else document.form1.ok.disabled=true; } 4) Phương thức trên mảng element • Focus (): Đưa con trỏ về lại text box hoặc dropdownmenu document.forms[i].elements[j].focus() Ví dụ: document.form1.user.focus(); Lưu ý: Nếu ta đang làm việc trên document hiện hành, thì có thể bỏ qua document nameForm.nameField.property hoặc nameForm.nameField.method II. Các phần tử trên form 1. Thao tác trên trường radio Để lấy giá trị của trường radio ta phải sử dụng đến mảng element. Duyệt qua tất cả các phần tử và kiểm tra phần tử đó có được checked không ? Cú pháp: Countfield=nameform.length for(var i=0 ; i<Countfield ; i++) r Giatri=nameform.elements[i].value [...]... function chontrinhduyet() { count=document.form1.length; for(i=0; ispt-1 Ví dụ: function chonkhoa() { option=document.forms[0].khoa.options[document forms[0].khoa.selectedIndex].text txt=document.forms[0].chon.value txt=txt + option document.forms[0].chon.value=txt } III THAY ĐỔI NỘI DUNG ĐỘNG TRÊN TRANG 1 Thay đổi nội dung trên trang dựa vào inner và outer Ta... s2=Intro.innerHTML Thì s1=Monitor SAMSUNG Và s2=Monitor SAMSUNG Ví dụ:thiết kế form có dạng: function chonsp() { prod=document.form1.masp.value; hinhsp=document.forms[0].hinh.options[document forms[0].hinh.selectedIndex].text; price=document.form1.giasp.value; ma.innerText=prod; hinh.innerText=hinhsp; gia.innerText=price } function ChangeImage(path) { h.innerHTML=" . xử lý của form thứ i Document.forms[i].action Length Trả về số form trên trang web Hoặc trả về số phần tử trên form thứ i Countform=document.forms.length Countfield=document.forms[i].length Name. của form Ví dụ: <script> function kq() { sptform=document.form1.length document.form1.spt.value=sptform tenform=document.forms[0].name document.form1.formname.value=tenform } </script> 3 box hoặc dropdownmenu document.forms[i].elements[j].focus() Ví dụ: document.form1.user.focus(); Lưu ý: Nếu ta đang làm việc trên document hiện hành, thì có thể bỏ qua document nameForm.nameField.property hoặc