Thông tin tài liệu:
CHƢƠNG XVII(tt)MÔ HÌNH ĐỐI TƢỢNG.I.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ử Button CheckboxTên sự kiện onClick onClick
Nội dung trích xuất từ tài liệu:
Đối tượng formCHƢƠNG XVII(tt) MÔ HÌNH ĐỐI TƢỢNGI. Đố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ệnButton onClickCheckbox onClickForm OnSubmit, onResetTextbox OnBlur,OnChange,OnFocus,OnselectRadio OnClickReset button OnClickDropdown menu OnBlur,onChange,onFocus,onSelectSubmit button OnClickTextarea OnBlur,OnChange,OnFocus,Onselect 2. Thuộc tính của formT/tính Mô tả Ví dụAction Trả về đường dẫn Document.forms[i].action (URL) đến tập tin xử lý của form thứ iLength Trả về số form trên Countform=document.forms.length trang web Countfield=document.forms[i].length Hoặc trả về số phần tử trên form thứ iName Trả về giá trị tên Nameform=document.forms[i].name của form thứ iMethod Các định phương Methodform=document.forms[i].method thức của form thứ ielements mảng element chứa document.forms[i].elements[j].value các phần tử trên formVí dụ: function kq() { sptform=document.form1.length document.form1.spt.value=sptform tenform=document.forms[0].name document.form1.formname.value=tenform } 3. Các thuộc tính trên mảng elementT/ tính Mô tả Ví dụ Xác định tên của document.forms[i].elements[j].nameName phần tử j trên form thứ i. Xác định lọai của document.forms[i].elements[j].typeType đối tượng Xác định giá trị của document.forms[i].elements[j].value phần tử thứ j trongValue form i. Xác định phần tử document.form[i].Checked thứ j có được elements[j].checked checked không trả về giá trị true hoặc false Thiết lập chế độ document.form[i].elements[j].Disabled vô hiệu hóa đối disabled tượng Kiểm tra phần tử document.form[i].elements[j].isDisable có bị vô hiệu hóa isDisable hay không Cho phép/không document.forms[i].elements[j]readOnly thay đổi nội .readOnly dung của phần tử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.propertyhoặc nameForm.nameField.methodII. Các phần tử trên from 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 ; iVí dụ: function chontrinhduyet() { count=document.form1.length; for(i=0; iVí dụ : Checkboxfunction check(){ coffee=document.forms[0].coffee answer=document.forms[0].answer txt= for (i = 0; i2. Thao tác trên dropdownmenu a) Thuộc tính và phương thức của dropdownmenu Thuôc tính Thuộc tính Mô tả Ví dụ Trả về số phần tử spt=nameform.namefield.length length trong danh sách dropdownmenu. trả về chỉ số của spt=nameform.namefield. selectedIndex phần tử được chọn selectedIndex trong danh sách mảng option được đánh chỉ số từ options 0->spt-1Ví 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 dùng đặc tính inner và outer để thay đổi nội dung hoặc lấy giá trị của một vùng nào đó trên trang web. a) Phân biệt giữa inner và outer Inner là nội dung chứa bên trong của đối tượng chứa ID. Inner gồm có InnerHTML lấy nội dung text và tag HTML bên trong đối tượng ID innerText: chỉ lấy nội dung text bên trong dối tượng ID Outer là phần inner và bản thân đối tượng chứa ID. Outer gồm có outerHT ...