Nhập và nhận lại thông tin từ các biểu mẫu
lượt xem 19
download
Biểu mẫu là sự thiết kết, nơi kết hợp nhiều những đối tượng lên trên một trang html của bạn dùng để nhập/xuất giá trị vào/ra. Các đối tượng đó bao gồm: Textfield, checkboxes, radio button, select, textarea…
Bình luận(0) Đăng nhập để gửi bình luận!
Nội dung Text: Nhập và nhận lại thông tin từ các biểu mẫu
- 6 http://www.dayhoctructuyen.com/file.php/158/PART6.HTM 6. Nhập và nhận lại thông tin từ các biểu mẫu Biểu mẫu là sự thiết kết, nơi kết hợp nhiều những đối tượng lên trên một trang html của bạn dùng để nhập/xuất giá trị vào/ra. Các đối tượng đó bao gồm: Textfield, checkboxes, radio button, select, textarea… a. Cách đặt tên cho các đối tương trong biểu mẫu Để try cập đến các đối tựơng trong biểu mẫu, bạn cần phải đặt tên cho các đối tượng trong biểu mẫu đó, Qui tắc đặt tên cho các đối tượng giống như đặt tên cho biến, đặt tên hàm, tên không có khoảng trống. Tên của các đối tượng được xác định trong từ khoá name của các thẻ cụ thể. Ví dụ: OK: là tên của nút submit T1: là tên của TextField b. Đọc và thiết lập giá trị cho các phần tử + Đọc và thiết lập giá trị cho các trường văn bản: Để thiết lập giá trị hay nhận lại giá trị từ các trường văn bản bạn phải truy cập đối các đối tượng đó theo cú pháp sau: window.document.formname.objectname.value Trong đó formname là tên của form được xác định trong thẻ thường đặt ở dòng đầu tiên của phần Ví dụ: objectname: là tên của đối tượng văn bản cần truy cập. Để gàn giá trị cho trường văn bản đó bạn viết như sau: window.document.formname.objectname.value=”giá trị”; Để nhận lại giá trị từ các trường văn bản bạn viết: var st=window.document.formname.objectname.value; Ví dụ: function docong() { var a=document.form.T1.value; var b=document.form.T2.value; document.form.T3.value=a+' + '+b+' = '; document.form.T4.value=a*1+b*1; } function clearS() { document.form.T3.value=””; document.form.T4.value=””; window.status="Hay nhap lai cho a va b "; return true; } 1 of 4 3/28/2008 10:43 AM
- 6 http://www.dayhoctructuyen.com/file.php/158/PART6.HTM Trong phần body viết như sau: + Chú ý: Cách nhận và nhận lấy giá trị cho các vùng văn bản textarea cũng thực hiện tương tự các trường văn bản textField. + Đọc và thiết lập giá trị cho các hộp kiểm tra: Thuộc tính checked của đối tượng hộp kiểm tra có thể xác định hộp đó có được chọn hay không và ta cũng có thể thiết đặt thuộc tính cho các hôp chọn này: ̣ Cách thao tác trên trên các đối tượng này như sau: window.document.formname.objectname.checked Trong đó formname và objectname là như trên. Ví dụ: để xem một hộp kiểm tra có được chọn hay không ta viết như sau: if(window.document.formname.objectname.checked==true) Và ta có thể gán cho hộp kiểm tra đó đang ở chế độ được chọn ta có thể viết: window.document.formname.objectname.checked=true; Chú ý: Nếu ta không xác định tên cho tập hợp các hộp kiểm tra checkbox, ta có thể xác định hộp kiểm tra nào được chọn có thể truy cập thông qua phương thức elements truy cập đến chỉ số của phần tử nào đó trong hộp kiểm tra. Bạn có thể tham khảo ví dụ về phần này trong phần mảng ở mục tiếp theo. + Đọc và thiết lập giá trị cho các hộp chọn lựa: Vì tất cả các hộp chọn lựa trong cùng một nhóm có cùng một tên, do đó để nhận biết hộp nào được chọn javaScript sẽ cho phép xác định các phần tử của hộp chọn lựa thông qua chỉ số phần tử của nó. Ví dụ một nhóm có 4 hộp chọn lựa, nhóm đó có tên là radioname thì lúc đó ta có thể truy cập đến mỗi hộp chọn lựa thông qua chỉ số của nó, chỉ số phần tử được xác định bắt đầu từ 0. Việc kiểm tra lấy lại trạng thái hộp chọn lựa có thể được thực hiện theo cú pháp sau: if(window.document.formname.objectname[i].checked) hay ta có thể gán giá trị cho hộp lựa chọn như sau: window.document.formname.radioname[0].checked=true; + Đọc và thiết lập giá trị cho các menu thả xuống và danh sách cuộn: Bạn có thể đọc và thiết lập giá trị chọn cho menu thả xuống và danh sách cuộn giống như hộp kiểm tra hay hộp chọn thông qua chỉ số phần tử của nó: Ví du: 2 of 4 3/28/2008 10:43 AM
- 6 http://www.dayhoctructuyen.com/file.php/158/PART6.HTM Lúc đó ta có thể biết menu thả xuống nào được chọn thông qua chỉ số của nó như sau: if(window.document. myform.selectlist.options[0].checked==true) {alert(“this is boy”); } Ngoài ra ta có thể xác đinh được phần tử nào được chọn thông qua phương th selectedIndex, phương thức này sẽ trả về chỉ số phần tử được chọn trong menu thả xuống, cách viết như sau: var num = window.document.myform.selectlist.selectedIndex; Ta cũng có thể lấy lại giá trị từ phần tử nào đó được chọn trong menu thả xuống thông qua phương thức value như sau: var num = window.document.myform.selectlist.selectedIndex; var val = window.document.myform.selectlist.options[num].value; +Xử lý các sự kiện bằng cách dùng các phần tử của biểu mẫu Phần tử Sự kiện Hành động kích hoạt Nút nhấn onClick Hộp kiểm tra onClick Nút chọn lựa onClick Trường văn bản onChange Thay đổi nội dung trường văn bản và sau đó nháy chuột bên ngoài trường văn bản đó. Vùng văn bản onChange Thay đổi nội dung vùng văn bản và sau đó nháy chuột bên ngoài vùng văn bản đó. Chọn lựa onChange Thay đổi mục chọn lựa trong menu thả xuống Biểu mẫu OnSubmit Nhấn Enter trong một trường văn bản hay nháy chuột vào nút submit. Ví dụ: Sau đây là một ví dụ sử dụng menu thả xuống như một công cụ mở một trang mới theo địa chỉ cho săn: 3 of 4 3/28/2008 10:43 AM
- 6 http://www.dayhoctructuyen.com/file.php/158/PART6.HTM function doit(site) { window.location=site; } Sau đó viết trong phần như sau: Trang thông tin việt nam Trang Công nghệ IBM Microsoft learning Java Chú ý: vì ta gọi trực tiếp trong đối tượng select, thừ khoá this có thể thay thế cho đối tượng hiện hành này: Ta có thể thay thế từ this này với cụm từ thường dùng: window.document.lam.sel Bài tập cũng cố 1. Trong javascript để gán giá trị cho các đối tượng như Textbox, radio, checkbox, option... ta gán thông qua phương thức value của đói tượng đó Đúng Sai 2. Để viết một hàm trả về một kết quả nào đó ta phải khai báo return trong thân hàm Đúng Không đúng 3. Để gán thuộc tính được chọn(checked) cho đối tượng radio hay checkbox ta có thể gán trị true cho phưong thức checked của đối tựơng đó Không đúng đúng 4. Từ khoá this có thể thay thế cho window.document.. khi nào Không thay thế Gọi và xử lí trực tiếp trên đối tượng đó Tất cả mọi khi được 5. Khi nhấn Enter trong trường văn bản hay click vào nút Submit thì sự kiện nào được gọi: Onclick() OnSubmit() OnChange() Xem kết quả 4 of 4 3/28/2008 10:43 AM
CÓ THỂ BẠN MUỐN DOWNLOAD
-
ẨN VÀ KHÓA THƯ MỤC MÀ KHÔNG CẦN DÙNG PHẦN MỀM
5 p | 813 | 312
-
Giới thiệu khái quát về máy tính và các thiết bị ngoại vi
68 p | 391 | 68
-
Hướng dẫn sử dụng powerpoint 2010 part 14
6 p | 123 | 40
-
Tài liệu môn học: Phân tích và thiết kế HTTT theo UML - Phần 1
64 p | 108 | 19
-
AJAX - TƯƠNG LAI CỦA WEB 2.0
9 p | 69 | 16
-
ADSL - TRIỂN KHAI ADSL part 2
5 p | 68 | 14
-
Bài giảng Tổng quan về phân tích thiết kế HTTT và nguồn phần mềm - ĐH FPT
44 p | 93 | 10
-
Hệ quản trị cơ sở dữ liệu MS Access - Bài 3
63 p | 144 | 7
-
6http://www.dayhoctructuyen.com/file.php/158/PART6.HTM6. Nhập và nhận lại thông tin
4 p | 74 | 6
-
Cẩn trọng khi làm việc với file PDF
2 p | 78 | 6
-
Security365
34 p | 78 | 6
-
Đề kiểm tra kết thúc mô đun: quản trị hệ thống với sql server - Đề số: 1
4 p | 129 | 4
-
ÑOÀ HOÏA MAÙY TÍNHCaùc thuaät toaùn toâ maøuDaãn nhaäp• Moät vuøng toâ
16 p | 42 | 4
Chịu trách nhiệm nội dung:
Nguyễn Công Hà - Giám đốc Công ty TNHH TÀI LIỆU TRỰC TUYẾN VI NA
LIÊN HỆ
Địa chỉ: P402, 54A Nơ Trang Long, Phường 14, Q.Bình Thạnh, TP.HCM
Hotline: 093 303 0098
Email: support@tailieu.vn