Biểu mẫu html hoạt động như thế nào?

Biểu mẫu HTML là một phần của tài liệu chứa nội dung bình thường, đánh dấu, các phần tử đặc biệt được gọi là điều khiển (hộp kiểm, nút radio, menu, v.v. ) và nhãn trên các điều khiển đó. Người dùng thường "hoàn thành" một biểu mẫu bằng cách sửa đổi các điều khiển của nó (nhập văn bản, chọn các mục menu, v.v. ), trước khi gửi biểu mẫu cho đại lý để xử lý (e. g. , tới máy chủ Web, tới máy chủ thư, v.v. )

Đây là một biểu mẫu đơn giản bao gồm nhãn, nút radio và nút ấn (đặt lại biểu mẫu hoặc gửi biểu mẫu)

 
    

First name:
Last name:
email:
Male
Female

Ghi chú. Thông số kỹ thuật này bao gồm thông tin chi tiết hơn về biểu mẫu trong các tiểu mục về vấn đề hiển thị biểu mẫu

Người dùng tương tác với các biểu mẫu thông qua các điều khiển được đặt tên

"Tên điều khiển" của điều khiển được cung cấp bởi thuộc tính tên của nó. Phạm vi của thuộc tính tên cho một điều khiển trong phần tử MẪU là phần tử MẪU

Mỗi điều khiển có cả giá trị ban đầu và giá trị hiện tại, cả hai đều là chuỗi ký tự. Vui lòng tham khảo định nghĩa của từng điều khiển để biết thông tin về các giá trị ban đầu và các ràng buộc có thể có đối với các giá trị do điều khiển áp đặt. Nói chung, "giá trị ban đầu" của điều khiển có thể được chỉ định bằng thuộc tính giá trị của phần tử điều khiển. Tuy nhiên, giá trị ban đầu của phần tử TEXTAREA được cung cấp bởi nội dung của nó và giá trị ban đầu của phần tử ĐỐI TƯỢNG trong biểu mẫu được xác định bởi việc triển khai đối tượng (i. e. , nó nằm ngoài phạm vi của thông số kỹ thuật này)

"Giá trị hiện tại" của điều khiển trước tiên được đặt thành giá trị ban đầu. Sau đó, giá trị hiện tại của điều khiển có thể được sửa đổi thông qua tương tác của người dùng và tập lệnh

Giá trị ban đầu của điều khiển không thay đổi. Do đó, khi một biểu mẫu được đặt lại, giá trị hiện tại của mỗi điều khiển được đặt lại về giá trị ban đầu. Nếu một điều khiển không có giá trị ban đầu, ảnh hưởng của việc đặt lại biểu mẫu đối với điều khiển đó là không xác định

Khi một biểu mẫu được gửi để xử lý, một số điều khiển có tên được ghép nối với giá trị hiện tại của chúng và các cặp này được gửi cùng với biểu mẫu. Những điều khiển mà cặp tên/giá trị được gửi được gọi là điều khiển thành công

HTML định nghĩa các loại điều khiển sau

nút Tác giả có thể tạo ba loại nút

Tác giả tạo các nút có phần tử BUTTON hoặc phần tử INPUT. Vui lòng tham khảo định nghĩa của các phần tử này để biết chi tiết về cách chỉ định các loại nút khác nhau

Ghi chú. Các tác giả nên lưu ý rằng phần tử BUTTON cung cấp khả năng hiển thị phong phú hơn phần tử INPUT

hộp kiểmHộp kiểm (và nút radio) là công tắc bật/tắt mà người dùng có thể bật/tắt. Công tắc được "bật" khi thuộc tính đã kiểm tra của thành phần điều khiển được đặt. Khi một biểu mẫu được gửi, chỉ các điều khiển hộp kiểm "bật" mới có thể thành công

Một số hộp kiểm trong một biểu mẫu có thể có cùng tên điều khiển. Vì vậy, ví dụ, các hộp kiểm cho phép người dùng chọn một số giá trị cho cùng một thuộc tính. Phần tử INPUT được sử dụng để tạo điều khiển hộp kiểm

các nút radioCác nút radio giống như các hộp kiểm ngoại trừ khi một số chia sẻ cùng một tên điều khiển, chúng sẽ loại trừ lẫn nhau. khi một cái được bật "on", tất cả những cái khác có cùng tên sẽ bị "tắt". Phần tử INPUT được sử dụng để tạo điều khiển nút radio. Nếu không có nút radio nào trong một nhóm có cùng tên điều khiển được "bật" ban đầu, hành vi của tác nhân người dùng để chọn điều khiển nào ban đầu được "bật" là không xác định. Ghi chú. Do các triển khai hiện tại xử lý trường hợp này theo cách khác, nên thông số kỹ thuật hiện tại khác với RFC 1866 ([RFC1866] phần 8. 1. 2. 4), trong đó nêu rõ
Tại mọi thời điểm, chính xác một trong các nút radio trong bộ được chọn. Nếu không có thành phần nào của tập hợp các nút radio chỉ định `CHECKED', thì tác nhân người dùng phải kiểm tra nút radio đầu tiên của tập hợp đó ngay từ đầu

Do hành vi của tác nhân người dùng khác nhau, nên các tác giả phải đảm bảo rằng trong mỗi bộ nút radio, một nút ban đầu được "bật"

menuMenu cung cấp cho người dùng các tùy chọn để chọn. Phần tử SELECT tạo menu, kết hợp với phần tử OPTGROUP và OPTION. nhập văn bản Tác giả có thể tạo hai loại điều khiển cho phép người dùng nhập văn bản. Phần tử INPUT tạo điều khiển đầu vào một dòng và phần tử TEXTAREA tạo điều khiển đầu vào nhiều dòng. Trong cả hai trường hợp, văn bản đầu vào trở thành giá trị hiện tại của điều khiển. chọn tệp Loại điều khiển này cho phép người dùng chọn tệp để nội dung của chúng có thể được gửi bằng biểu mẫu. Phần tử INPUT được sử dụng để tạo điều khiển chọn tệp. điều khiển ẩn Tác giả có thể tạo điều khiển không được hiển thị nhưng có giá trị được gửi cùng với biểu mẫu. Các tác giả thường sử dụng loại điều khiển này để lưu trữ thông tin giữa các trao đổi máy khách/máy chủ mà nếu không sẽ bị mất do tính chất không trạng thái của HTTP (xem [RFC2616]). Phần tử INPUT được sử dụng để tạo điều khiển ẩn. điều khiển đối tượng Tác giả có thể chèn các đối tượng chung trong các biểu mẫu sao cho các giá trị liên quan được gửi cùng với các điều khiển khác. Tác giả tạo các điều khiển đối tượng với phần tử ĐỐI TƯỢNG

Các phần tử được sử dụng để tạo các điều khiển thường xuất hiện bên trong phần tử MẪU, nhưng cũng có thể xuất hiện bên ngoài khai báo phần tử MẪU khi chúng được sử dụng để xây dựng giao diện người dùng. Điều này được thảo luận trong phần về các sự kiện nội tại. Lưu ý rằng các điều khiển bên ngoài biểu mẫu không thể là điều khiển thành công

thẻ bắt đầu. bắt buộc, Thẻ kết thúc. yêu cầu

Định nghĩa thuộc tính

action = uri [CT]Thuộc tính này chỉ định tác nhân xử lý biểu mẫu. Hành vi tác nhân người dùng cho một giá trị không phải là URI HTTP không được xác định. phương pháp = nhận. post [CI]Thuộc tính này chỉ định phương thức HTTP nào sẽ được sử dụng để gửi tập dữ liệu biểu mẫu. Các giá trị có thể (không phân biệt chữ hoa chữ thường) là "get" (mặc định) và "post". Xem phần gửi biểu mẫu để biết thông tin sử dụng. enctype = content-type [CI] Thuộc tính này chỉ định loại nội dung được sử dụng để gửi biểu mẫu tới máy chủ (khi giá trị của phương thức là "bài đăng"). Giá trị mặc định cho thuộc tính này là "application/x-www-form-urlencoded". Giá trị "multipart/form-data" nên được sử dụng kết hợp với phần tử INPUT, type="file". accept-charset = danh sách bộ ký tự [CI] Thuộc tính này chỉ định danh sách mã hóa ký tự cho dữ liệu đầu vào được máy chủ xử lý biểu mẫu này chấp nhận. Giá trị là danh sách các giá trị bộ ký tự được phân tách bằng dấu cách và/hoặc dấu phẩy. Khách hàng phải diễn giải danh sách này dưới dạng danh sách độc quyền-hoặc danh sách, tôi. e. , máy chủ có thể chấp nhận bất kỳ mã hóa ký tự đơn nào cho mỗi thực thể nhận được

Giá trị mặc định cho thuộc tính này là chuỗi dành riêng "UNKNOWN". Tác nhân người dùng có thể diễn giải giá trị này dưới dạng mã hóa ký tự được sử dụng để truyền tài liệu chứa phần tử FORM này

accept = content-type-list [CI] Thuộc tính này chỉ định danh sách các loại nội dung được phân tách bằng dấu phẩy mà máy chủ xử lý biểu mẫu này sẽ xử lý chính xác. Tác nhân người dùng có thể sử dụng thông tin này để lọc ra các tệp không phù hợp khi nhắc người dùng chọn tệp để gửi đến máy chủ (cf. phần tử INPUT khi type="file"). name = cdata [CI]Thuộc tính này đặt tên cho thành phần để nó có thể được tham chiếu từ biểu định kiểu hoặc tập lệnh. Ghi chú. Thuộc tính này đã được đưa vào để tương thích ngược. Các ứng dụng nên sử dụng thuộc tính id để xác định các phần tử

Các thuộc tính được xác định ở nơi khác

Phần tử FORM đóng vai trò là nơi chứa các điều khiển. Nó chỉ định

  • Bố cục của biểu mẫu (được đưa ra bởi nội dung của phần tử)
  • Chương trình sẽ xử lý biểu mẫu đã hoàn thành và đã gửi (thuộc tính hành động). Chương trình nhận phải có khả năng phân tích các cặp tên/giá trị để sử dụng chúng
  • Phương thức mà dữ liệu người dùng sẽ được gửi đến máy chủ (thuộc tính phương thức)
  • Mã hóa ký tự phải được máy chủ chấp nhận để xử lý biểu mẫu này (thuộc tính accept-charset). Tác nhân người dùng có thể thông báo cho người dùng về giá trị của thuộc tính accept-charset và/hoặc hạn chế khả năng nhập các ký tự không được nhận dạng của người dùng

Một biểu mẫu có thể chứa văn bản và đánh dấu (đoạn văn, danh sách, v.v. ) ngoài các điều khiển biểu mẫu

Ví dụ sau đây cho thấy một biểu mẫu sẽ được xử lý bởi chương trình "adduser" khi được gửi. Biểu mẫu sẽ được gửi đến chương trình bằng phương thức "đăng" HTTP

 
 ...form contents...
 

Vui lòng tham khảo phần gửi biểu mẫu để biết thông tin về cách tác nhân người dùng phải chuẩn bị dữ liệu biểu mẫu cho máy chủ và cách tác nhân người dùng nên xử lý các phản hồi dự kiến

Ghi chú. Thảo luận thêm về hành vi của các máy chủ nhận dữ liệu biểu mẫu nằm ngoài phạm vi của thông số kỹ thuật này



INPUT - O EMPTY              -- form control -->
%attrs;                              -- %coreattrs, %i18n, %events --
  type        %InputType;    TEXT      -- what kind of widget is needed --
  name        CDATA          #IMPLIED  -- submit as part of form --
  value       CDATA          #IMPLIED  -- Specify for radio buttons and checkboxes --
  checked     (checked)      #IMPLIED  -- for radio buttons and check boxes --
  disabled    (disabled)     #IMPLIED  -- unavailable in this context --
  readonly    (readonly)     #IMPLIED  -- for text and passwd --
  size        CDATA          #IMPLIED  -- specific to each type of field --
  maxlength   NUMBER         #IMPLIED  -- max chars for text fields --
  src         %URI;          #IMPLIED  -- for fields with images --
  alt         CDATA          #IMPLIED  -- short description --
  usemap      %URI;          #IMPLIED  -- use client-side image map --
  ismap       (ismap)        #IMPLIED  -- use server-side image map --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  accesskey   %Character;    #IMPLIED  -- accessibility key character --
  onfocus     %Script;       #IMPLIED  -- the element got the focus --
  onblur      %Script;       #IMPLIED  -- the element lost the focus --
  onselect    %Script;       #IMPLIED  -- some text was selected --
  onchange    %Script;       #IMPLIED  -- the element value was changed --
  accept      %ContentTypes; #IMPLIED  -- list of MIME types for file upload --
  >

thẻ bắt đầu. bắt buộc, Thẻ kết thúc. cấm

Định nghĩa thuộc tính

gõ = văn bản. mật khẩu mở khóa. hộp kiểm. Đài. Gửi đi. cài lại. tập tin. ẩn giấu. hình ảnh. button [CI]Thuộc tính này chỉ định loại điều khiển để tạo. Giá trị mặc định cho thuộc tính này là "văn bản". name = cdata [CI]Thuộc tính này gán tên điều khiển. value = cdata [CA]Thuộc tính này chỉ định giá trị ban đầu của điều khiển. Nó là tùy chọn trừ khi thuộc tính loại có giá trị "radio" hoặc "hộp kiểm". size = cdata [CN]Thuộc tính này cho tác nhân người dùng biết chiều rộng ban đầu của điều khiển. Chiều rộng được tính bằng pixel trừ khi thuộc tính loại có giá trị "văn bản" hoặc "mật khẩu". Trong trường hợp đó, giá trị của nó đề cập đến số ký tự (số nguyên). maxlength = number [CN]Khi thuộc tính loại có giá trị "văn bản" hoặc "mật khẩu", thuộc tính này chỉ định số lượng ký tự tối đa mà người dùng có thể nhập. Con số này có thể vượt quá kích thước được chỉ định, trong trường hợp đó, tác nhân người dùng nên cung cấp cơ chế cuộn. Giá trị mặc định cho thuộc tính này là số lượng không giới hạn. đã chọn [CI]Khi thuộc tính loại có giá trị "radio" hoặc "hộp kiểm", thuộc tính boolean này chỉ định rằng nút đang bật. Tác nhân người dùng phải bỏ qua thuộc tính này cho các loại điều khiển khác. src = uri [CT]Khi thuộc tính type có giá trị "hình ảnh", thuộc tính này chỉ định vị trí của hình ảnh sẽ được sử dụng để trang trí nút gửi đồ họa

Các thuộc tính được xác định ở nơi khác

Loại điều khiển được xác định bởi phần tử INPUT phụ thuộc vào giá trị của thuộc tính loại

textTạo điều khiển nhập văn bản một dòng. mật khẩuGiống như "văn bản", nhưng văn bản đầu vào được hiển thị theo cách ẩn các ký tự (e. g. , một dãy dấu hoa thị). Loại điều khiển này thường được sử dụng cho đầu vào nhạy cảm như mật khẩu. Lưu ý rằng giá trị hiện tại là văn bản do người dùng nhập, không phải văn bản do tác nhân người dùng hiển thị

Ghi chú. Các nhà thiết kế ứng dụng nên lưu ý rằng cơ chế này chỉ cung cấp khả năng bảo vệ an ninh nhẹ. Mặc dù mật khẩu được che dấu bởi các tác nhân người dùng từ những người quan sát bình thường, nhưng nó được truyền đến máy chủ ở dạng văn bản rõ ràng và bất kỳ ai có quyền truy cập mạng ở mức độ thấp đều có thể đọc được

hộp kiểmTạo hộp kiểm. radioTạo nút radio. submitTạo nút gửi. imageTạo nút gửi đồ họa. Giá trị của thuộc tính src chỉ định URI của hình ảnh sẽ trang trí nút. Vì lý do truy cập, tác giả nên cung cấp văn bản thay thế cho hình ảnh thông qua thuộc tính alt

Khi một thiết bị trỏ được sử dụng để nhấp vào hình ảnh, biểu mẫu sẽ được gửi và tọa độ nhấp được chuyển đến máy chủ. Giá trị x được đo bằng pixel từ bên trái của hình ảnh và giá trị y tính bằng pixel từ trên cùng của hình ảnh. Dữ liệu đã gửi bao gồm tên. x=x-giá trị và tên. y=y-value trong đó "tên" là giá trị của thuộc tính tên và giá trị x và giá trị y lần lượt là các giá trị tọa độ x và y

Nếu máy chủ thực hiện các hành động khác nhau tùy thuộc vào vị trí được nhấp, người dùng trình duyệt phi đồ họa sẽ gặp bất lợi. Vì lý do này, các tác giả nên xem xét các phương pháp thay thế

  • Sử dụng nhiều nút gửi (mỗi nút có hình ảnh riêng) thay cho một nút gửi đồ họa. Tác giả có thể sử dụng biểu định kiểu để kiểm soát vị trí của các nút này
  • Sử dụng bản đồ hình ảnh phía máy khách cùng với tập lệnh
resetTạo nút đặt lại. buttonTạo nút nhấn. Tác nhân người dùng nên sử dụng giá trị của thuộc tính giá trị làm nhãn của nút. hiddenTạo điều khiển ẩn. fileTạo điều khiển chọn tệp. Tác nhân người dùng có thể sử dụng giá trị của thuộc tính giá trị làm tên tệp ban đầu

17. 4. 2 Ví dụ về các biểu mẫu chứa các điều khiển INPUT

Đoạn HTML mẫu sau xác định một biểu mẫu đơn giản cho phép người dùng nhập tên, họ, địa chỉ email và giới tính. Khi nút gửi được kích hoạt, biểu mẫu sẽ được gửi đến chương trình được chỉ định bởi thuộc tính hành động

 
    

First name:
Last name:
email:
Male
Female

Biểu mẫu này có thể được hiển thị như sau

Biểu mẫu html hoạt động như thế nào?

Trong phần về phần tử LABEL, chúng ta thảo luận về việc đánh dấu các nhãn như "Tên"

Trong ví dụ tiếp theo này, tên hàm JavaScript xác minh được kích hoạt khi sự kiện "onclick" xảy ra




 
    

Vui lòng tham khảo phần về các sự kiện nội tại để biết thêm thông tin về kịch bản và sự kiện

Ví dụ sau đây cho thấy nội dung của tệp do người dùng chỉ định có thể được gửi bằng biểu mẫu như thế nào. Người dùng được nhắc nhập tên của họ và một danh sách các tên tệp có nội dung sẽ được gửi cùng với biểu mẫu. Bằng cách chỉ định giá trị enctype của "multipart/form-data", nội dung của mỗi tệp sẽ được đóng gói để gửi trong một phần riêng biệt của tài liệu nhiều phần

 

What is your name? What files are you sending?

thẻ bắt đầu. bắt buộc, Thẻ kết thúc. yêu cầu

Các thuộc tính được xác định ở nơi khác

Các nút được tạo bằng phần tử BUTTON có chức năng giống như các nút được tạo bằng phần tử INPUT, nhưng chúng cung cấp khả năng hiển thị phong phú hơn. phần tử BUTTON có thể có nội dung. Ví dụ: phần tử BUTTON chứa hình ảnh có chức năng giống và có thể giống với phần tử INPUT có loại được đặt thành "hình ảnh", nhưng loại phần tử BUTTON cho phép nội dung

Các tác nhân người dùng trực quan có thể hiển thị các nút BUTTON với hình nổi và chuyển động lên/xuống khi được nhấp, trong khi chúng có thể hiển thị các nút INPUT dưới dạng hình ảnh "phẳng"

Ví dụ sau mở rộng ví dụ trước, nhưng tạo các nút gửi và đặt lại bằng BUTTON thay vì INPUT. Các nút chứa hình ảnh bằng phần tử IMG

 
    

First name:
Last name:
email:
Male
Female
Send

Biểu mẫu html hoạt động như thế nào?
Reset
Biểu mẫu html hoạt động như thế nào?

Nhớ lại rằng tác giả phải cung cấp văn bản thay thế cho phần tử IMG

Việc liên kết bản đồ hình ảnh với IMG xuất hiện dưới dạng nội dung của phần tử BUTTON là bất hợp pháp

VÍ DỤ BẤT HỢP PHÁP.
Đây không phải là HTML hợp pháp.

Biểu mẫu html hoạt động như thế nào?

thẻ bắt đầu. bắt buộc, Thẻ kết thúc. yêu cầu

CHỌN định nghĩa thuộc tính

name = cdata [CI]Thuộc tính này gán tên điều khiển. size = number [CN]Nếu phần tử CHỌN được hiển thị dưới dạng hộp danh sách cuộn, thuộc tính này chỉ định số lượng hàng trong danh sách sẽ hiển thị cùng một lúc. Tác nhân người dùng trực quan không bắt buộc phải trình bày phần tử CHỌN dưới dạng hộp danh sách; . nhiều [CI]Nếu được đặt, thuộc tính boolean này cho phép nhiều lựa chọn. Nếu không được đặt, phần tử CHỌN chỉ cho phép các lựa chọn đơn lẻ

Các thuộc tính được xác định ở nơi khác

Phần tử SELECT tạo menu. Mỗi lựa chọn do menu cung cấp được biểu thị bằng phần tử TÙY CHỌN. Một phần tử SELECT phải chứa ít nhất một phần tử OPTION

Phần tử OPTGROUP cho phép tác giả nhóm các lựa chọn một cách hợp lý. Điều này đặc biệt hữu ích khi người dùng phải chọn từ một danh sách dài các tùy chọn; . Trong HTML 4, tất cả các phần tử OPTGROUP phải được chỉ định trực tiếp trong phần tử SELECT (i. e. , các nhóm có thể không được lồng vào nhau)

Không hoặc nhiều lựa chọn có thể được chọn trước cho người dùng. Tác nhân người dùng nên xác định lựa chọn nào được chọn trước như sau

  • Nếu không có phần tử TÙY CHỌN nào có bộ thuộc tính đã chọn, hành vi của tác nhân người dùng để chọn tùy chọn nào được chọn ban đầu là không xác định. Ghi chú. Do các triển khai hiện tại xử lý trường hợp này theo cách khác, nên thông số kỹ thuật hiện tại khác với RFC 1866 ([RFC1866] phần 8. 1. 3), trong đó nêu rõ
    Trạng thái ban đầu có tùy chọn đầu tiên được chọn, trừ khi thuộc tính SELECTED xuất hiện trên bất kỳ

    Do hành vi của tác nhân người dùng khác nhau, tác giả phải đảm bảo rằng mỗi menu bao gồm một TÙY CHỌN được chọn trước mặc định

  • Nếu một phần tử TÙY CHỌN có tập thuộc tính đã chọn, nó sẽ được chọn trước
  • Nếu phần tử CHỌN có tập hợp nhiều thuộc tính và nhiều phần tử TÙY CHỌN có tập hợp thuộc tính đã chọn, thì tất cả các phần tử đó phải được chọn trước
  • Nó được coi là lỗi nếu có nhiều hơn một phần tử TÙY CHỌN có tập hợp thuộc tính đã chọn và phần tử CHỌN không có tập hợp nhiều thuộc tính. Tác nhân người dùng có thể khác nhau về cách họ xử lý lỗi này, nhưng không nên chọn trước nhiều hơn một lựa chọn

thẻ bắt đầu. bắt buộc, Thẻ kết thúc. yêu cầu

Định nghĩa thuộc tính OPTGROUP

label = text [CS]Thuộc tính này chỉ định nhãn cho nhóm tùy chọn

Các thuộc tính được xác định ở nơi khác

Ghi chú. Những người triển khai được khuyên rằng các phiên bản HTML trong tương lai có thể mở rộng cơ chế nhóm để cho phép các nhóm lồng nhau (i. e. , phần tử OPTGROUP có thể lồng vào nhau). Điều này sẽ cho phép các tác giả đại diện cho một hệ thống phân cấp lựa chọn phong phú hơn

thẻ bắt đầu. bắt buộc, Thẻ kết thúc. không bắt buộc

TÙY CHỌN Định nghĩa thuộc tính

đã chọn [CI]Khi được đặt, thuộc tính boolean này chỉ định rằng tùy chọn này được chọn trước. value = cdata [CS]Thuộc tính này chỉ định giá trị ban đầu của điều khiển. Nếu thuộc tính này không được đặt, giá trị ban đầu được đặt thành nội dung của phần tử TÙY CHỌN. label = text [CS]Thuộc tính này cho phép tác giả chỉ định nhãn ngắn hơn cho một tùy chọn so với nội dung của phần tử TÙY CHỌN. Khi được chỉ định, tác nhân người dùng nên sử dụng giá trị của thuộc tính này thay vì nội dung của phần tử TÙY CHỌN làm nhãn tùy chọn

Các thuộc tính được xác định ở nơi khác

Khi hiển thị lựa chọn menu, tác nhân người dùng nên sử dụng giá trị của thuộc tính nhãn của phần tử TÙY CHỌN làm lựa chọn. Nếu thuộc tính này không được chỉ định, tác nhân người dùng nên sử dụng nội dung của phần tử TÙY CHỌN

Thuộc tính nhãn của phần tử OPTGROUP chỉ định nhãn cho một nhóm các lựa chọn

Trong ví dụ này, chúng tôi tạo một menu cho phép người dùng chọn cài đặt thành phần nào trong bảy thành phần phần mềm. Các thành phần thứ nhất và thứ hai được chọn trước nhưng người dùng có thể bỏ chọn. Các thành phần còn lại không được chọn trước. Thuộc tính kích thước nói rằng menu chỉ nên có 4 hàng mặc dù người dùng có thể chọn trong số 7 tùy chọn. Các tùy chọn khác sẽ được cung cấp thông qua cơ chế cuộn

CHỌN được theo sau bởi các nút gửi và đặt lại

________số 8

Chỉ các tùy chọn đã chọn mới thành công (sử dụng tên điều khiển "chọn thành phần"). Khi không có tùy chọn nào được chọn, điều khiển không thành công và cả tên cũng như bất kỳ giá trị nào đều không được gửi tới máy chủ khi biểu mẫu được gửi. Lưu ý rằng nơi đặt thuộc tính giá trị, nó sẽ xác định giá trị ban đầu của điều khiển, nếu không thì đó là nội dung của phần tử

Trong ví dụ này, chúng tôi sử dụng phần tử OPTGROUP để nhóm các lựa chọn. Đánh dấu sau

 

đại diện cho nhóm sau

 
 ...form contents...
 
0

Tác nhân người dùng trực quan có thể cho phép người dùng chọn từ các nhóm tùy chọn thông qua menu phân cấp hoặc một số cơ chế khác phản ánh cấu trúc của các lựa chọn

Tác nhân người dùng đồ họa có thể hiển thị điều này dưới dạng

Biểu mẫu html hoạt động như thế nào?

Hình ảnh này hiển thị một phần tử CHỌN được hiển thị dưới dạng các menu xếp tầng. Nhãn trên cùng của menu hiển thị giá trị hiện được chọn (PortMaster 3, 3. 7. 1). Người dùng đã mở hai menu xếp tầng nhưng chưa chọn giá trị mới (PortMaster 2, 3. 7). Lưu ý rằng mỗi menu xếp tầng hiển thị nhãn của phần tử OPTGROUP hoặc TÙY CHỌN

thẻ bắt đầu. bắt buộc, Thẻ kết thúc. yêu cầu

Định nghĩa thuộc tính

name = cdata [CI]Thuộc tính này gán tên điều khiển. rows = number [CN]Thuộc tính này chỉ định số dòng văn bản hiển thị. Người dùng có thể nhập nhiều dòng hơn mức này, do đó, tác nhân người dùng nên cung cấp một số phương tiện để cuộn qua nội dung của điều khiển khi nội dung vượt ra ngoài vùng hiển thị. cols = number [CN]Thuộc tính này chỉ định chiều rộng hiển thị theo chiều rộng ký tự trung bình. Người dùng có thể nhập các dòng dài hơn dòng này, do đó, tác nhân người dùng nên cung cấp một số phương tiện để cuộn qua nội dung của điều khiển khi nội dung vượt ra ngoài vùng hiển thị. Tác nhân người dùng có thể bọc các dòng văn bản có thể nhìn thấy để giữ cho các dòng dài có thể nhìn thấy mà không cần cuộn

Các thuộc tính được xác định ở nơi khác

Phần tử TEXTAREA tạo điều khiển nhập văn bản nhiều dòng. Tác nhân người dùng nên sử dụng nội dung của phần tử này làm giá trị ban đầu của điều khiển và sẽ hiển thị văn bản này ban đầu

Ví dụ này tạo một điều khiển VĂN BẢN có 20 hàng x 80 cột và ban đầu chứa hai dòng văn bản. VĂN BẢN được theo sau bởi các nút gửi và đặt lại

 
 ...form contents...
 
1

Đặt thuộc tính chỉ đọc cho phép tác giả hiển thị văn bản không thể sửa đổi trong VĂN BẢN. Điều này khác với việc sử dụng văn bản được đánh dấu tiêu chuẩn trong tài liệu vì giá trị của TEXTAREA được gửi cùng với biểu mẫu

ISINDEX không được dùng nữa. Phần tử này tạo điều khiển nhập văn bản một dòng. Tác giả nên sử dụng phần tử INPUT để tạo các điều khiển nhập văn bản

Xem DTD chuyển tiếp để biết định nghĩa chính thức

Các thuộc tính được xác định ở nơi khác

Phần tử ISINDEX tạo điều khiển nhập văn bản một dòng cho phép nhập bất kỳ số lượng ký tự nào. Tác nhân người dùng có thể sử dụng giá trị của thuộc tính dấu nhắc làm tiêu đề cho dấu nhắc

Ngữ nghĩa của ISINDEX. Hiện tại, ngữ nghĩa cho ISINDEX chỉ được xác định rõ khi URI cơ sở cho tài liệu kèm theo là một URI HTTP. Trên thực tế, chuỗi đầu vào bị giới hạn ở Latin-1 vì không có cơ chế nào để URI chỉ định một bộ ký tự khác

Một số điều khiển biểu mẫu tự động có nhãn được liên kết với chúng (nhấn nút) trong khi hầu hết thì không (trường văn bản, hộp kiểm và nút radio và menu)

Đối với những điều khiển có nhãn ẩn, tác nhân người dùng nên sử dụng giá trị của thuộc tính giá trị làm chuỗi nhãn

Phần tử LABEL được sử dụng để chỉ định nhãn cho các điều khiển không có nhãn ẩn,

thẻ bắt đầu. bắt buộc, Thẻ kết thúc. yêu cầu

Định nghĩa thuộc tính

for = idref [CS]Thuộc tính này liên kết rõ ràng nhãn đang được xác định với một điều khiển khác. Khi xuất hiện, giá trị của thuộc tính này phải giống với giá trị của thuộc tính id của một số điều khiển khác trong cùng một tài liệu. Khi vắng mặt, nhãn được xác định được liên kết với nội dung của phần tử

Các thuộc tính được xác định ở nơi khác

Phần tử LABEL có thể được sử dụng để đính kèm thông tin vào các điều khiển. Mỗi phần tử LABEL được liên kết với chính xác một điều khiển biểu mẫu

Thuộc tính for liên kết nhãn với một điều khiển khác một cách rõ ràng. giá trị của thuộc tính for phải giống với giá trị của thuộc tính id của phần tử điều khiển được liên kết. Nhiều LABEL có thể được liên kết với cùng một điều khiển bằng cách tạo nhiều tham chiếu thông qua thuộc tính for

Ví dụ này tạo một bảng được dùng để căn chỉnh hai điều khiển nhập văn bản và các nhãn được liên kết của chúng. Mỗi nhãn được liên kết rõ ràng với một kiểu nhập văn bản

 
 ...form contents...
 
2

Ví dụ này mở rộng một mẫu ví dụ trước để bao gồm các phần tử LABEL

 
    

First name:
Last name:
email:
Male
Female

Để liên kết ngầm một nhãn với một điều khiển khác, phần tử điều khiển phải nằm trong nội dung của phần tử LABEL. Trong trường hợp này, LABEL chỉ có thể chứa một thành phần điều khiển. Bản thân nhãn có thể được định vị trước hoặc sau điều khiển liên quan

Trong ví dụ này, chúng tôi ngầm liên kết hai nhãn với hai điều khiển nhập văn bản

 
 ...form contents...
 
4

Lưu ý rằng kỹ thuật này không thể được sử dụng khi một bảng đang được sử dụng để bố trí, với nhãn trong một ô và điều khiển liên quan của nó trong một ô khác

Khi một phần tử LABEL nhận được tiêu điểm, nó sẽ chuyển tiêu điểm đến điều khiển được liên kết của nó. Xem phần bên dưới về các khóa truy cập để biết ví dụ

Nhãn có thể được hiển thị bởi tác nhân người dùng theo một số cách (e. g. , trực quan, đọc bằng bộ tổng hợp giọng nói, v.v. )

thẻ bắt đầu. bắt buộc, Thẻ kết thúc. yêu cầu

LEGEND Định nghĩa thuộc tính

căn = hàng đầu. đáy. bên trái. phải [CI]Không dùng nữa. Thuộc tính này chỉ định vị trí của chú giải đối với bộ trường. Những giá trị khả thi
  • đứng đầu. Truyền thuyết nằm ở đầu bộ trường. Đây là giá trị mặc định
  • đáy. Truyền thuyết nằm ở dưới cùng của fieldset
  • bên trái. Truyền thuyết nằm ở phía bên trái của fieldset
  • bên phải. Truyền thuyết nằm ở bên phải của fieldset

Các thuộc tính được xác định ở nơi khác

Phần tử FIELDSET cho phép tác giả nhóm các điều khiển và nhãn liên quan theo chủ đề. Điều khiển nhóm giúp người dùng hiểu mục đích của họ dễ dàng hơn đồng thời hỗ trợ điều hướng theo tab cho tác nhân người dùng trực quan và điều hướng giọng nói cho tác nhân người dùng định hướng giọng nói. Việc sử dụng hợp lý phần tử này làm cho tài liệu dễ truy cập hơn

Phần tử LEGEND cho phép tác giả gán chú thích cho FIELDSET. Chú giải cải thiện khả năng truy cập khi FIELDSET được hiển thị không trực quan

Trong ví dụ này, chúng tôi tạo một biểu mẫu mà một người có thể điền tại văn phòng bác sĩ. Nó được chia thành ba phần. thông tin cá nhân, tiền sử bệnh và thuốc hiện tại. Mỗi phần chứa các điều khiển để nhập thông tin thích hợp

 
 ...form contents...
 
5

Lưu ý rằng trong ví dụ này, chúng tôi có thể cải thiện cách trình bày trực quan của biểu mẫu bằng cách căn chỉnh các thành phần trong mỗi FIELDSET (với biểu định kiểu), thêm thông tin về màu sắc và phông chữ (với biểu định kiểu), thêm tập lệnh (giả sử, để chỉ mở "thuốc hiện tại

Trong tài liệu HTML, một phần tử phải nhận được tiêu điểm từ người dùng để hoạt động và thực hiện các tác vụ của nó. Ví dụ: người dùng phải kích hoạt một liên kết được chỉ định bởi phần tử A để theo liên kết được chỉ định. Tương tự, người dùng phải đặt tiêu điểm VĂN BẢN để nhập văn bản vào đó

Có một số cách để tập trung vào một phần tử

  • Chỉ định phần tử bằng thiết bị trỏ
  • Điều hướng từ phần tử này sang phần tử tiếp theo bằng bàn phím. Tác giả của tài liệu có thể xác định thứ tự tab chỉ định thứ tự các phần tử sẽ nhận được tiêu điểm nếu người dùng điều hướng tài liệu bằng bàn phím (xem điều hướng tab). Sau khi được chọn, một phần tử có thể được kích hoạt bởi một số chuỗi phím khác
  • Chọn một thành phần thông qua phím truy cập (đôi khi được gọi là "phím tắt" hoặc "trình tăng tốc bàn phím")

Định nghĩa thuộc tính

tabindex = number [CN]Thuộc tính này chỉ định vị trí của phần tử hiện tại theo thứ tự tab cho tài liệu hiện tại. Giá trị này phải là một số từ 0 đến 32767. Tác nhân người dùng nên bỏ qua các số 0 đứng đầu

Thứ tự tab xác định thứ tự các phần tử sẽ nhận được tiêu điểm khi người dùng điều hướng qua bàn phím. Thứ tự tab có thể bao gồm các phần tử được lồng trong các phần tử khác

Các yếu tố có thể nhận tiêu điểm phải được điều hướng bởi tác nhân người dùng theo các quy tắc sau

  1. Những phần tử hỗ trợ thuộc tính tabindex và gán giá trị dương cho nó sẽ được điều hướng trước. Điều hướng tiến hành từ phần tử có giá trị tabindex thấp nhất đến phần tử có giá trị cao nhất. Các giá trị không cần phải theo trình tự và cũng không phải bắt đầu bằng bất kỳ giá trị cụ thể nào. Các phần tử có giá trị chỉ mục tab giống hệt nhau phải được điều hướng theo thứ tự chúng xuất hiện trong luồng ký tự
  2. Những phần tử không hỗ trợ thuộc tính tabindex hoặc hỗ trợ và gán cho nó giá trị "0" sẽ được điều hướng tiếp theo. Các phần tử này được điều hướng theo thứ tự chúng xuất hiện trong luồng ký tự
  3. Các phần tử bị vô hiệu hóa không tham gia vào thứ tự tab

Các phần tử sau hỗ trợ thuộc tính tabindex. A, KHU VỰC, NÚT, ĐẦU VÀO, ĐỐI TƯỢNG, CHỌN và VĂN BẢN

Trong ví dụ này, thứ tự tab sẽ là BUTTON, các phần tử INPUT theo thứ tự (lưu ý rằng "field1" và nút chia sẻ cùng một chỉ mục tab, nhưng "field1" xuất hiện sau trong luồng ký tự) và cuối cùng là liên kết được tạo bởi

 
 ...form contents...
 
6

phím tab. Chuỗi khóa thực tế gây ra điều hướng tab hoặc kích hoạt phần tử phụ thuộc vào cấu hình của tác nhân người dùng (e. g. , phím "tab" được sử dụng để điều hướng và phím "enter" được sử dụng để kích hoạt phần tử đã chọn)

Tác nhân người dùng cũng có thể xác định trình tự khóa để điều hướng thứ tự tab ngược lại. Khi đạt đến điểm cuối (hoặc điểm bắt đầu) của thứ tự gắn thẻ, tác nhân người dùng có thể quay lại điểm đầu (hoặc điểm cuối)

Định nghĩa thuộc tính

accesskey = character [CN]Thuộc tính này gán khóa truy cập cho một phần tử. Khóa truy cập là một ký tự đơn trong bộ ký tự tài liệu. Ghi chú. Tác giả nên xem xét phương thức nhập liệu của người đọc dự kiến ​​khi chỉ định khóa truy cập

Nhấn một phím truy cập được gán cho một phần tử sẽ đặt tiêu điểm cho phần tử đó. Hành động xảy ra khi một phần tử nhận tiêu điểm phụ thuộc vào phần tử. Ví dụ: khi người dùng kích hoạt một liên kết được xác định bởi phần tử A, tác nhân người dùng thường đi theo liên kết. Khi người dùng kích hoạt nút radio, tác nhân người dùng sẽ thay đổi giá trị của nút radio. Khi người dùng kích hoạt một trường văn bản, nó sẽ cho phép nhập liệu, v.v.

Các phần tử sau hỗ trợ thuộc tính mã truy cập. A, KHU VỰC, NÚT, ĐẦU VÀO, NHÃN và HUYỀN THOẠI và VĂN BẢN

Ví dụ này gán khóa truy cập "U" cho nhãn được liên kết với điều khiển INPUT. Nhập phím truy cập sẽ đặt tiêu điểm vào nhãn, từ đó đưa nhãn đó đến điều khiển được liên kết. Sau đó, người dùng có thể nhập văn bản vào vùng INPUT

 
 ...form contents...
 
7

Trong ví dụ này, chúng tôi gán một khóa truy cập cho một liên kết được xác định bởi phần tử A. Nhập khóa truy cập này sẽ đưa người dùng đến một tài liệu khác, trong trường hợp này là mục lục

 
 ...form contents...
 
8

Việc gọi các khóa truy cập phụ thuộc vào hệ thống cơ bản. Chẳng hạn, trên các máy chạy MS Windows, người ta thường phải nhấn phím "alt" ngoài phím truy cập. Trên các hệ thống của Apple, người ta thường phải nhấn phím "cmd" ngoài phím truy cập

Việc hiển thị các khóa truy cập phụ thuộc vào tác nhân người dùng. Chúng tôi khuyên các tác giả nên bao gồm khóa truy cập trong văn bản nhãn hoặc bất cứ nơi nào áp dụng khóa truy cập. Tác nhân người dùng phải hiển thị giá trị của khóa truy cập theo cách để nhấn mạnh vai trò của nó và để phân biệt nó với các ký tự khác (e. g. , bằng cách gạch dưới nó)

Trong các ngữ cảnh mà đầu vào của người dùng là không mong muốn hoặc không liên quan, điều quan trọng là có thể vô hiệu hóa một điều khiển hoặc hiển thị nó ở chế độ chỉ đọc. Ví dụ: một người có thể muốn tắt nút gửi của biểu mẫu cho đến khi người dùng nhập một số dữ liệu bắt buộc. Tương tự, một tác giả có thể muốn bao gồm một đoạn văn bản chỉ đọc phải được gửi dưới dạng một giá trị cùng với biểu mẫu. Các phần sau mô tả các điều khiển bị vô hiệu hóa và chỉ đọc

Định nghĩa thuộc tính

bị vô hiệu hóa [CI]Khi được đặt cho điều khiển biểu mẫu, thuộc tính boolean này sẽ vô hiệu hóa điều khiển cho đầu vào của người dùng

Khi được đặt, thuộc tính bị vô hiệu hóa có các hiệu ứng sau đối với một phần tử

Các phần tử sau hỗ trợ thuộc tính bị vô hiệu hóa. NÚT, ĐẦU VÀO, OPTGROUP, TÙY CHỌN, CHỌN và VĂN BẢN

Thuộc tính này được kế thừa nhưng các khai báo cục bộ sẽ ghi đè giá trị được kế thừa

Cách các phần tử bị vô hiệu hóa được hiển thị tùy thuộc vào tác nhân người dùng. Ví dụ: một số tác nhân người dùng đã vô hiệu hóa các mục menu, nhãn nút, v.v.

Trong ví dụ này, phần tử INPUT bị tắt. Do đó, nó không thể nhận đầu vào của người dùng cũng như giá trị của nó sẽ không được gửi cùng với biểu mẫu

 
 ...form contents...
 
9

Ghi chú. Cách duy nhất để sửa đổi động giá trị của thuộc tính bị vô hiệu hóa là thông qua tập lệnh

Định nghĩa thuộc tính

chỉ đọc [CI]Khi được đặt cho điều khiển biểu mẫu, thuộc tính boolean này cấm thay đổi điều khiển

Thuộc tính chỉ đọc chỉ định liệu người dùng có thể sửa đổi điều khiển hay không

Khi được đặt, thuộc tính chỉ đọc có các tác dụng sau đối với một phần tử

Các phần tử sau hỗ trợ thuộc tính chỉ đọc. ĐẦU VÀO VÀ VĂN BẢN

Cách hiển thị các phần tử chỉ đọc tùy thuộc vào tác nhân người dùng

Ghi chú. Cách duy nhất để sửa đổi động giá trị của thuộc tính chỉ đọc là thông qua tập lệnh

Các phần sau đây giải thích cách tác nhân người dùng gửi dữ liệu biểu mẫu để tạo thành tác nhân xử lý

Thuộc tính phương thức của phần tử FORM chỉ định phương thức HTTP được sử dụng để gửi biểu mẫu tới tác nhân xử lý. Thuộc tính này có thể nhận hai giá trị

  • lấy. Với phương thức HTTP "get", tập dữ liệu biểu mẫu được thêm vào URI được chỉ định bởi thuộc tính hành động (với dấu chấm hỏi ("?") làm dấu tách) và URI mới này được gửi đến tác nhân xử lý
  • bưu kiện. Với phương thức "đăng" HTTP, tập dữ liệu biểu mẫu được bao gồm trong phần thân của biểu mẫu và được gửi đến tác nhân xử lý

Phương thức "get" nên được sử dụng khi biểu mẫu không có giá trị (i. e. , không gây tác dụng phụ). Nhiều tìm kiếm cơ sở dữ liệu không có tác dụng phụ có thể nhìn thấy và tạo ra các ứng dụng lý tưởng cho phương thức "lấy"

Nếu dịch vụ liên quan đến việc xử lý biểu mẫu gây ra tác dụng phụ (ví dụ: nếu biểu mẫu sửa đổi cơ sở dữ liệu hoặc đăng ký dịch vụ), nên sử dụng phương pháp "đăng"

Ghi chú. Phương thức "get" giới hạn các giá trị của tập dữ liệu biểu mẫu thành các ký tự ASCII. Chỉ phương thức "đăng" (với enctype="multipart/form-data") được chỉ định để bao gồm toàn bộ bộ ký tự [ISO10646]

Kiểm soát thành công là "hợp lệ" để gửi. Mọi điều khiển thành công đều có tên điều khiển được ghép nối với giá trị hiện tại của nó như một phần của tập dữ liệu biểu mẫu đã gửi. Điều khiển thành công phải được xác định trong phần tử FORM và phải có tên điều khiển

Tuy nhiên

  • Điều khiển bị vô hiệu hóa không thể thành công
  • Nếu một biểu mẫu chứa nhiều nút gửi, chỉ nút gửi được kích hoạt là thành công
  • Tất cả các hộp kiểm "bật" có thể thành công
  • Đối với các nút radio có cùng giá trị của thuộc tính tên, chỉ nút radio "bật" mới có thể thành công
  • Đối với menu, tên điều khiển được cung cấp bởi phần tử CHỌN và giá trị được cung cấp bởi phần tử TÙY CHỌN. Chỉ các tùy chọn đã chọn mới có thể thành công. Khi không có tùy chọn nào được chọn, điều khiển không thành công và cả tên cũng như bất kỳ giá trị nào đều không được gửi tới máy chủ khi biểu mẫu được gửi
  • Giá trị hiện tại của một tệp được chọn là danh sách một hoặc nhiều tên tệp. Khi gửi biểu mẫu, nội dung của mỗi tệp được gửi cùng với phần còn lại của dữ liệu biểu mẫu. Nội dung tệp được đóng gói theo loại nội dung của biểu mẫu
  • Giá trị hiện tại của một điều khiển đối tượng được xác định bởi việc triển khai đối tượng

Nếu một điều khiển không có giá trị hiện tại khi biểu mẫu được gửi, tác nhân người dùng không bắt buộc phải coi đó là một điều khiển thành công

Hơn nữa, các tác nhân người dùng không nên coi các điều khiển sau đây là thành công

Điều khiển ẩn và điều khiển không được hiển thị do cài đặt biểu định kiểu vẫn có thể thành công. Ví dụ



INPUT - O EMPTY              -- form control -->
%attrs;                              -- %coreattrs, %i18n, %events --
  type        %InputType;    TEXT      -- what kind of widget is needed --
  name        CDATA          #IMPLIED  -- submit as part of form --
  value       CDATA          #IMPLIED  -- Specify for radio buttons and checkboxes --
  checked     (checked)      #IMPLIED  -- for radio buttons and check boxes --
  disabled    (disabled)     #IMPLIED  -- unavailable in this context --
  readonly    (readonly)     #IMPLIED  -- for text and passwd --
  size        CDATA          #IMPLIED  -- specific to each type of field --
  maxlength   NUMBER         #IMPLIED  -- max chars for text fields --
  src         %URI;          #IMPLIED  -- for fields with images --
  alt         CDATA          #IMPLIED  -- short description --
  usemap      %URI;          #IMPLIED  -- use client-side image map --
  ismap       (ismap)        #IMPLIED  -- use server-side image map --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  accesskey   %Character;    #IMPLIED  -- accessibility key character --
  onfocus     %Script;       #IMPLIED  -- the element got the focus --
  onblur      %Script;       #IMPLIED  -- the element lost the focus --
  onselect    %Script;       #IMPLIED  -- some text was selected --
  onchange    %Script;       #IMPLIED  -- the element value was changed --
  accept      %ContentTypes; #IMPLIED  -- list of MIME types for file upload --
  >
0

vẫn sẽ khiến một giá trị được ghép nối với tên "mật khẩu vô hình" và được gửi cùng với biểu mẫu

Khi người dùng gửi một biểu mẫu (e. g. , bằng cách kích hoạt nút gửi), tác nhân người dùng xử lý nó như sau

Bước một. Xác định các điều khiển thành công

Bước hai. Xây dựng tập dữ liệu biểu mẫu

Tập dữ liệu biểu mẫu là một chuỗi các cặp tên điều khiển/giá trị hiện tại được tạo từ các điều khiển thành công

Bước thứ ba. Mã hóa tập dữ liệu biểu mẫu

Tập dữ liệu biểu mẫu sau đó được mã hóa theo loại nội dung được chỉ định bởi thuộc tính enctype của phần tử FORM

Bước bốn. Gửi bộ dữ liệu biểu mẫu được mã hóa

Cuối cùng, dữ liệu được mã hóa được gửi đến tác nhân xử lý được chỉ định bởi thuộc tính hành động bằng cách sử dụng giao thức được chỉ định bởi thuộc tính phương thức

Thông số kỹ thuật này không chỉ định tất cả các phương thức gửi hoặc loại nội dung hợp lệ có thể được sử dụng với các biểu mẫu. Tuy nhiên, tác nhân người dùng HTML 4 phải hỗ trợ các quy ước đã thiết lập trong các trường hợp sau

  • Nếu phương thức là "lấy" và hành động là một URI HTTP, thì tác nhân người dùng sẽ lấy giá trị của hành động, nối thêm `?' . Sau đó, tác nhân người dùng duyệt qua liên kết tới URI này. Trong trường hợp này, dữ liệu biểu mẫu được giới hạn mã ASCII
  • Nếu phương thức là "bài đăng" và hành động là một URI HTTP, thì tác nhân người dùng sẽ tiến hành giao dịch "bài đăng" HTTP bằng cách sử dụng giá trị của thuộc tính hành động và một thông báo được tạo theo loại nội dung được chỉ định bởi thuộc tính enctype

Đối với bất kỳ giá trị nào khác của hành động hoặc phương thức, hành vi không được chỉ định

Tác nhân người dùng sẽ hiển thị phản hồi từ các giao dịch HTTP "nhận" và "đăng"

Thuộc tính enctype của phần tử FORM chỉ định loại nội dung được sử dụng để mã hóa tập dữ liệu biểu mẫu để gửi tới máy chủ. Tác nhân người dùng phải hỗ trợ các loại nội dung được liệt kê bên dưới. Hành vi cho các loại nội dung khác là không xác định

Ngoài ra, vui lòng tham khảo phần thoát dấu và trong các giá trị thuộc tính URI

ứng dụng/x-www-form-urlencoded

Đây là loại nội dung mặc định. Các biểu mẫu được gửi với loại nội dung này phải được mã hóa như sau

  1. Tên và giá trị điều khiển được thoát. Các ký tự khoảng trắng được thay thế bằng `+', sau đó các ký tự dành riêng được thoát ra như được mô tả trong [RFC1738], phần 2. 2. Các ký tự không phải chữ và số được thay thế bằng `%HH', một dấu phần trăm và hai chữ số thập lục phân biểu thị mã ASCII của ký tự. Ngắt dòng được biểu diễn dưới dạng cặp "CR LF" (i. e. , `%0D%0A')
  2. Tên/giá trị điều khiển được liệt kê theo thứ tự chúng xuất hiện trong tài liệu. Tên được phân tách khỏi giá trị bằng `=' và các cặp tên/giá trị được phân tách bằng `&'

nhiều phần/biểu mẫu dữ liệu

Ghi chú. Vui lòng tham khảo [RFC2388] để biết thêm thông tin về tệp tải lên, bao gồm các vấn đề về khả năng tương thích ngược, mối quan hệ giữa "nhiều phần/biểu mẫu dữ liệu" và các loại nội dung khác, các vấn đề về hiệu suất, v.v.

Vui lòng tham khảo phụ lục để biết thông tin về các vấn đề bảo mật cho các biểu mẫu

Loại nội dung "application/x-www-form-urlencoded" không hiệu quả để gửi số lượng lớn dữ liệu nhị phân hoặc văn bản chứa các ký tự không phải ASCII. Loại nội dung "multipart/form-data" nên được sử dụng để gửi biểu mẫu chứa tệp, dữ liệu không phải ASCII và dữ liệu nhị phân

Nội dung "dữ liệu nhiều phần/biểu mẫu" tuân theo các quy tắc của tất cả các luồng dữ liệu MIME nhiều phần như được nêu trong [RFC2045]. Định nghĩa "multipart/form-data" có sẵn tại sổ đăng ký [IANA]

Thông báo "nhiều phần/biểu mẫu dữ liệu" chứa một loạt các phần, mỗi phần đại diện cho một điều khiển thành công. Các bộ phận được gửi đến tác nhân xử lý theo cùng thứ tự các điều khiển tương ứng xuất hiện trong luồng tài liệu. Ranh giới một phần không được xuất hiện trong bất kỳ dữ liệu nào;

Như với tất cả các loại MIME nhiều phần, mỗi phần có tiêu đề "Kiểu nội dung" tùy chọn mặc định là "văn bản/đơn giản". Tác nhân người dùng phải cung cấp tiêu đề "Loại nội dung", kèm theo tham số "bộ ký tự"

Mỗi phần dự kiến ​​​​sẽ chứa

  1. tiêu đề "Bố trí nội dung" có giá trị là "dữ liệu biểu mẫu"
  2. một thuộc tính tên chỉ định tên điều khiển của điều khiển tương ứng. Tên điều khiển ban đầu được mã hóa trong bộ ký tự không phải ASCII có thể được mã hóa bằng phương pháp được nêu trong [RFC2045]

Do đó, ví dụ, đối với điều khiển có tên "mycontrol", phần tương ứng sẽ được chỉ định



INPUT - O EMPTY              -- form control -->
%attrs;                              -- %coreattrs, %i18n, %events --
  type        %InputType;    TEXT      -- what kind of widget is needed --
  name        CDATA          #IMPLIED  -- submit as part of form --
  value       CDATA          #IMPLIED  -- Specify for radio buttons and checkboxes --
  checked     (checked)      #IMPLIED  -- for radio buttons and check boxes --
  disabled    (disabled)     #IMPLIED  -- unavailable in this context --
  readonly    (readonly)     #IMPLIED  -- for text and passwd --
  size        CDATA          #IMPLIED  -- specific to each type of field --
  maxlength   NUMBER         #IMPLIED  -- max chars for text fields --
  src         %URI;          #IMPLIED  -- for fields with images --
  alt         CDATA          #IMPLIED  -- short description --
  usemap      %URI;          #IMPLIED  -- use client-side image map --
  ismap       (ismap)        #IMPLIED  -- use server-side image map --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  accesskey   %Character;    #IMPLIED  -- accessibility key character --
  onfocus     %Script;       #IMPLIED  -- the element got the focus --
  onblur      %Script;       #IMPLIED  -- the element lost the focus --
  onselect    %Script;       #IMPLIED  -- some text was selected --
  onchange    %Script;       #IMPLIED  -- the element value was changed --
  accept      %ContentTypes; #IMPLIED  -- list of MIME types for file upload --
  >
1

Như với tất cả các lần truyền MIME, "CR LF" (i. e. , `%0D%0A') được sử dụng để phân tách các dòng dữ liệu

Mỗi phần có thể được mã hóa và tiêu đề "Mã hóa truyền nội dung" được cung cấp nếu giá trị của phần đó không tuân theo mã hóa (7BIT) mặc định (xem [RFC2045], phần 6)

Nếu nội dung của tệp được gửi cùng với biểu mẫu, đầu vào tệp phải được xác định theo loại nội dung thích hợp (e. g. , "application/octet-stream"). Nếu nhiều tệp được trả về do kết quả của một mục nhập biểu mẫu, chúng sẽ được trả về dưới dạng "nhiều phần/hỗn hợp" được nhúng trong "nhiều phần/dữ liệu biểu mẫu"

Tác nhân người dùng nên cố gắng cung cấp tên tệp cho mỗi tệp đã gửi. Tên tệp có thể được chỉ định bằng tham số "tên tệp" của 'Bố trí nội dung. tiêu đề dữ liệu biểu mẫu' hoặc, trong trường hợp có nhiều tệp, trong phần 'Bố trí nội dung. file' tiêu đề của subpart. Nếu tên tệp của hệ điều hành của khách hàng không ở dạng US-ASCII, thì tên tệp có thể được mã hóa gần đúng hoặc được mã hóa bằng phương pháp [RFC2045]. Điều này thuận tiện cho những trường hợp, chẳng hạn như các tệp đã tải lên có thể chứa các tham chiếu đến nhau (e. g. , tệp TeX và tệp ". sty" mô tả phong cách phụ trợ)

Ví dụ sau minh họa mã hóa "multipart/form-data". Giả sử chúng ta có dạng sau



INPUT - O EMPTY              -- form control -->
%attrs;                              -- %coreattrs, %i18n, %events --
  type        %InputType;    TEXT      -- what kind of widget is needed --
  name        CDATA          #IMPLIED  -- submit as part of form --
  value       CDATA          #IMPLIED  -- Specify for radio buttons and checkboxes --
  checked     (checked)      #IMPLIED  -- for radio buttons and check boxes --
  disabled    (disabled)     #IMPLIED  -- unavailable in this context --
  readonly    (readonly)     #IMPLIED  -- for text and passwd --
  size        CDATA          #IMPLIED  -- specific to each type of field --
  maxlength   NUMBER         #IMPLIED  -- max chars for text fields --
  src         %URI;          #IMPLIED  -- for fields with images --
  alt         CDATA          #IMPLIED  -- short description --
  usemap      %URI;          #IMPLIED  -- use client-side image map --
  ismap       (ismap)        #IMPLIED  -- use server-side image map --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  accesskey   %Character;    #IMPLIED  -- accessibility key character --
  onfocus     %Script;       #IMPLIED  -- the element got the focus --
  onblur      %Script;       #IMPLIED  -- the element lost the focus --
  onselect    %Script;       #IMPLIED  -- some text was selected --
  onchange    %Script;       #IMPLIED  -- the element value was changed --
  accept      %ContentTypes; #IMPLIED  -- list of MIME types for file upload --
  >
2

Nếu người dùng nhập "Larry" trong kiểu nhập văn bản và chọn tệp văn bản "file1. txt", tác nhân người dùng có thể gửi lại dữ liệu sau



INPUT - O EMPTY              -- form control -->
%attrs;                              -- %coreattrs, %i18n, %events --
  type        %InputType;    TEXT      -- what kind of widget is needed --
  name        CDATA          #IMPLIED  -- submit as part of form --
  value       CDATA          #IMPLIED  -- Specify for radio buttons and checkboxes --
  checked     (checked)      #IMPLIED  -- for radio buttons and check boxes --
  disabled    (disabled)     #IMPLIED  -- unavailable in this context --
  readonly    (readonly)     #IMPLIED  -- for text and passwd --
  size        CDATA          #IMPLIED  -- specific to each type of field --
  maxlength   NUMBER         #IMPLIED  -- max chars for text fields --
  src         %URI;          #IMPLIED  -- for fields with images --
  alt         CDATA          #IMPLIED  -- short description --
  usemap      %URI;          #IMPLIED  -- use client-side image map --
  ismap       (ismap)        #IMPLIED  -- use server-side image map --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  accesskey   %Character;    #IMPLIED  -- accessibility key character --
  onfocus     %Script;       #IMPLIED  -- the element got the focus --
  onblur      %Script;       #IMPLIED  -- the element lost the focus --
  onselect    %Script;       #IMPLIED  -- some text was selected --
  onchange    %Script;       #IMPLIED  -- the element value was changed --
  accept      %ContentTypes; #IMPLIED  -- list of MIME types for file upload --
  >
3

Nếu người dùng đã chọn tệp (hình ảnh) thứ hai "file2. gif", tác nhân người dùng có thể xây dựng các phần như sau

Các biểu mẫu được tạo trong HTML như thế nào?

Các thành phần được sử dụng trong biểu mẫu HTML là hộp kiểm, hộp nhập liệu, nút radio, nút gửi, v.v. Sử dụng các yếu tố này, thông tin của người dùng được gửi trên máy chủ web. Thẻ biểu mẫu được sử dụng để tạo biểu mẫu HTML .

Điều gì xảy ra khi bạn gửi biểu mẫu HTML?

Hầu hết các biểu mẫu HTML đều có nút gửi ở cuối biểu mẫu. Khi tất cả các trường trong biểu mẫu đã được điền vào, người dùng nhấp vào nút gửi để ghi lại dữ liệu biểu mẫu. Hành vi tiêu chuẩn là thu thập tất cả dữ liệu đã được nhập vào biểu mẫu và gửi dữ liệu đó đến một chương trình khác để xử lý .

Biểu mẫu web hoạt động như thế nào?

Biểu mẫu web là các trang mà người dùng của bạn yêu cầu bằng trình duyệt của họ . Các trang này có thể được viết bằng cách sử dụng kết hợp HTML, tập lệnh máy khách, điều khiển máy chủ và mã máy chủ.