Tôi có thể sử dụng textarea làm HTML đầu vào không?

Đối với loại, tôi thậm chí không chắc chúng ta có thể khai báo một loại khác với 'văn bản' hay thậm chí cần trong các phiên bản HTML cũ hơn. Nó được định nghĩa là một vùng văn bản

Lý tưởng nhất là chúng tôi loại bỏ càng nhiều chức năng ra khỏi HTML của mình càng tốt, trước khi giới thiệu các kiểu;

Tiết lộ. Hỗ trợ của bạn giúp giữ cho trang web hoạt động. Chúng tôi kiếm được phí giới thiệu cho một số dịch vụ chúng tôi đề xuất trên trang này. Tìm hiểu thêm

What does

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

8 do?The element is used to create a text input area of unlimited length. By default, text in a <textarea> is rendered in a monospace or fixed-width font, and text areas are most often used within a parent <form> element.Displayinline<p><p>nội dung</p><ul><li></li><li></li><li></li><li></li><li></li></ul></p><h2 id="ma-vi-du">Mã ví dụ</h2><pre><code><textarea placeholder="You can type into this textarea all day long if you'd like to, but without a submit button to click all of your hard work will just be wasted.">

This text area is limited to just 10 characters

This text area is readonly and cannot be changed

This value can't be changed 9 được sử dụng để làm gì?

Hầu hết các biểu mẫu HTML bao gồm một thành phần biểu mẫu gốc, một số ít các thành phần đầu vào (ít nhất một trong số đó sẽ thuộc loại gửi) và một hoặc nhiều vùng văn bản. Nếu bạn cần các trường biểu mẫu để chấp nhận địa chỉ email, số điện thoại và nội dung khác dễ xác định, hãy sử dụng loại đầu vào phù hợp. Tuy nhiên, khi bạn cần một trường có thể chấp nhận bất kỳ sự kết hợp và độ dài nào của các chữ cái, số và ký hiệu văn bản thuần túy, thì

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 là thành phần bạn đang tìm kiếm

Thuộc tính vùng văn bản HTML5

HTML5 đã giới thiệu một vài thuộc tính mới có thể được sử dụng với các phần tử vùng văn bản. Dưới đây là một số điều quan trọng nhất

• This text area is limited to just 10 characters
    
  This text area is readonly and cannot be changed
   This value can't be changed 

  1. Liên kết vùng văn bản với biểu mẫu. Sử dụng thuộc tính ID của biểu mẫu làm giá trị cho thuộc tính biểu mẫu vùng văn bản. Điều này cho phép bạn đặt một vùng văn bản ở bất kỳ đâu trên trang web, ngay cả bên ngoài phần tử biểu mẫu và vẫn có nội dung của vùng văn bản khi biểu mẫu được gửi

• This text area is limited to just 10 characters
    
  This text area is readonly and cannot be changed
   This value can't be changed 

  2 và

  This text area is limited to just 10 characters
    
  This text area is readonly and cannot be changed
   This value can't be changed 

  3. Được sử dụng để chỉ định số ký tự tối thiểu hoặc tối đa có thể được nhập vào vùng văn bản

• This text area is limited to just 10 characters
    
  This text area is readonly and cannot be changed
   This value can't be changed 

  4. Thêm văn bản giữ chỗ vào vùng văn bản sẽ biến mất ngay khi người dùng đặt con trỏ vào bên trong phần tử

• This text area is limited to just 10 characters
    
  This text area is readonly and cannot be changed
   This value can't be changed 

  0. Yêu cầu vùng văn bản chứa nội dung trước khi cho phép gửi biểu mẫu

• This text area is limited to just 10 characters
    
  This text area is readonly and cannot be changed
   This value can't be changed 

  1. Chỉ định có nên thêm các khoản hoàn trả cứng vào nội dung được gửi trong vùng văn bản hay không

Thuộc tính trong hành động

Dưới đây là một ví dụ về cách một số thuộc tính mới này có thể được sử dụng để kiểm soát hành vi của một vùng văn bản

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

Nếu chúng ta ghép nối các phần tử vùng văn bản đó với phần tử nút và tập lệnh đơn giản, chúng ta sẽ có dạng sau

Thẻ HTML textarea được sử dụng để tạo trường nhập văn bản có nhiều dòng trong một biểu mẫu. Nó được xác định bằng thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 và có thể chứa số lượng ký tự không giới hạn

---

Khi bạn đang tạo một biểu mẫu trong HTML, bạn có thể quyết định rằng bạn muốn chấp nhận một chuỗi văn bản dài. Ví dụ: nếu bạn đang tạo biểu mẫu liên hệ khách hàng cho trang web của nhà bán lẻ, bạn có thể muốn tạo một thành phần biểu mẫu chấp nhận mô tả chi tiết về vấn đề mà khách hàng đang gặp phải

Tìm trận đấu Bootcamp của bạn

• Career Karma kết hợp bạn với các bootcamp công nghệ hàng đầu
• Truy cập học bổng độc quyền và các khóa học chuẩn bị

Chọn sở thích của bạn
Tên

Họ

Email

Điện thoại .

By continuing you agree to our Terms of Service and Privacy Policy, and you consent to receive offers and opportunities from Career Karma by telephone, text message, and email.

Đó là nơi thẻ HTML

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 xuất hiện. Phần tử

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 được sử dụng để tạo phần tử biểu mẫu cung cấp các tính năng chỉnh sửa văn bản nhiều dòng. Phần tử này hữu ích nếu bạn muốn chấp nhận phản hồi văn bản dài hơn từ người dùng

Hướng dẫn này sẽ thảo luận, với một vài ví dụ, cách sử dụng thẻ HTML

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 trong mã của bạn. Khi kết thúc hướng dẫn này, bạn sẽ có tất cả kiến ​​thức cần thiết để sử dụng thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 như một chuyên gia

Thẻ vùng văn bản HTML

Thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 được sử dụng để xác định trường điều khiển nhập văn bản nhiều dòng trong một biểu mẫu. Thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 có khả năng chứa số lượng ký tự không giới hạn

Cú pháp của thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 như sau

Placeholder contents

Hãy chia nhỏ mã của chúng tôi. Thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 được sử dụng để xác định hộp vùng văn bản trong biểu mẫu web của chúng tôi. Không giống như thẻ

	What feedback do you have for us?


		Your feedback goes here.
	

3, thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 phải có cả thẻ mở (

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9) và thẻ đóng (

	What feedback do you have for us?


		Your feedback goes here.
	

6). Điều này là do văn bản mặc định mà vùng văn bản sẽ hiển thị nằm giữa hai thẻ

Chúng tôi cũng đã chỉ định hai thuộc tính trong ví dụ của chúng tôi

• các hàng hướng dẫn trình duyệt về số lượng hàng mà vùng văn bản nên có theo mặc định. Nói cách khác, thuộc tính rows chỉ định chiều cao của vùng văn bản
• cols là số cột mà vùng văn bản phải có theo mặc định. Nói cách khác, thuộc tính cols chỉ định độ rộng của vùng văn bản

» THÊM.   HTM so với HTML

Giả sử chúng ta đang xây dựng một biểu mẫu web cho một cửa hàng quần áo địa phương. Biểu mẫu này sẽ cho phép khách hàng đưa ra phản hồi về việc mua hàng của họ. Vì chúng tôi muốn cung cấp cho người dùng không gian để gửi các phản hồi chi tiết, nên chúng tôi sẽ sử dụng phần tử HTML

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 để thu thập phản hồi của người dùng

Chúng ta có thể sử dụng đoạn mã sau để tạo biểu mẫu phản hồi

	What feedback do you have for us?


		Your feedback goes here.
	

mã của chúng tôi trả về

Hãy chia nhỏ mã của chúng tôi. Đầu tiên, chúng tôi đã khai báo một thẻ

	What feedback do you have for us?


		Your feedback goes here.
	

8 được sử dụng để xác định biểu mẫu web của chúng tôi. Sau đó, chúng tôi đã sử dụng thẻ

	What feedback do you have for us?


		Your feedback goes here.
	

9 để thêm nhãn vào trang của mình, yêu cầu người dùng

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

00

Sau đó, chúng tôi đã sử dụng thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 để tạo biểu mẫu phản hồi. Chúng tôi đã chỉ định bốn thuộc tính, như sau

• rows được đặt thành 5 và lưu trữ số hàng mà trường nên có
• cols được đặt thành 30 và lưu trữ số lượng cột mà trường cần có
• id là mã định danh duy nhất được gán cho biểu mẫu, sẽ được sử dụng khi chúng tôi gửi biểu mẫu
• tên cũng được sử dụng để xác định biểu mẫu và được yêu cầu nếu chúng tôi muốn gửi biểu mẫu tới máy chủ web

Thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 được hỗ trợ bởi tất cả các trình duyệt chính

Ví dụ trên là cách triển khai cơ bản của thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9, nhưng chúng ta có thể làm cho biểu mẫu của mình nâng cao hơn

Ví dụ về vùng văn bản HTML

Hãy xem qua hai ví dụ nâng cao hơn để minh họa cách chúng ta có thể sử dụng thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 để tạo vùng văn bản

Độ dài tối thiểu và tối đa

Hãy quay lại ví dụ về cửa hàng quần áo của chúng ta. Giả sử chúng tôi muốn giới hạn số lượng ký tự mà người dùng gửi là 1000, để khuyến khích người dùng viết phản hồi ngắn gọn. Chúng tôi cũng muốn đặt giới hạn ký tự tối thiểu là 10 để đảm bảo người dùng viết nội dung nào đó vào biểu mẫu

» THÊM.   Phân biệt giữa các loại khoảng trắng trong HTML

Đó là nơi các thuộc tính độ dài tối thiểu và độ dài tối đa xuất hiện. minlength được sử dụng để chỉ định số ký tự tối thiểu mà người dùng phải viết và maxlength được sử dụng để chỉ định số ký tự tối đa mà người dùng có thể viết trong một biểu mẫu

Đây là một ví dụ về biểu mẫu web của chúng tôi từ trước đó có các thuộc tính độ dài tối thiểu và độ dài tối đa được đặt

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

0

hình thức của chúng tôi trở lại

Không có thay đổi rõ ràng nào đối với biểu mẫu của chúng tôi, nhưng nếu chúng tôi cố gắng gửi biểu mẫu của mình, nội dung của biểu mẫu sẽ được coi là không hợp lệ nếu người dùng đã viết hơn 1000 ký tự

Điều quan trọng cần lưu ý là, ngay cả khi người dùng viết ít hơn 10 ký tự trong biểu mẫu của chúng tôi, vùng văn bản vẫn sẽ được coi là hợp lệ. Nếu chúng tôi muốn thực thi giới hạn tối thiểu, chúng tôi cần chỉ định thuộc tính

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

05

Văn bản giữ chỗ

Trong biểu mẫu web trên của chúng tôi, chúng tôi chỉ định văn bản mặc định bên trong biểu mẫu của chúng tôi. Văn bản này nêu rõ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

06 Mặc dù đây là thông tin hữu ích nhưng người dùng phải xóa văn bản mặc định theo cách thủ công nếu họ không muốn nó trong biểu mẫu phản hồi của họ

Nếu bạn muốn chỉ định giá trị giữ chỗ, bạn có thể sử dụng thuộc tính

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

07. Thuộc tính này cho biết một giá trị giữ chỗ hiển thị khi biểu mẫu trống. Ngay khi người dùng bắt đầu nhập vào hộp, trình giữ chỗ sẽ biến mất

Đây là một ví dụ về một

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 có văn bản giữ chỗ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

06

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

6

mã của chúng tôi trả về

Như bạn có thể thấy, văn bản

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

06 xuất hiện trong hộp văn bản. Tuy nhiên, khi người dùng bắt đầu gõ, văn bản này biến mất. Chúng tôi biết rằng văn bản này là một trình giữ chỗ vì nó có màu xám nhạt, trong khi văn bản mặc định, như chúng tôi đã chỉ định trong ví dụ đầu tiên của chúng tôi trong bài viết này, xuất hiện ở dạng văn bản hoàn toàn màu đen (trừ khi có quy định khác)

"Career Karma bước vào cuộc đời tôi khi tôi cần nó nhất và nhanh chóng giúp tôi phù hợp với bootcamp. Hai tháng sau khi tốt nghiệp, tôi đã tìm được công việc mơ ước phù hợp với giá trị và mục tiêu của mình trong cuộc sống. "

Venus, Kỹ sư phần mềm tại Rockbot

Find Your Bootcamp Match

» THÊM.   Nút HTML. Hướng dẫn từng bước

Thuộc tính vùng văn bản HTML

Thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 chấp nhận một số thuộc tính dành riêng cho thẻ. Ngoài ra, thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 hỗ trợ tất cả các thuộc tính toàn cầu trong HTML

Dưới đây là các thuộc tính dành riêng cho thẻ được hỗ trợ bởi thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9

AttributeValueDescriptionautofocusautofocusCho biết vùng văn bản có nên lấy tiêu điểm khi tài liệu được tải hay không. colsnumberChỉ định số lượng dòng văn bản được hiển thị theo mặc định cho vùng văn bản. bị vô hiệu hóabooleanVô hiệu hóa vùng văn bản cho đầu vào của người dùng. formform IDLiên kết vùng văn bản với một biểu mẫu. số maxlength Chỉ định số ký tự tối đa được chấp nhận bởi vùng văn bản.
minlengthnumberChỉ định số ký tự tối thiểu được chấp nhận bởi vùng văn bản. namenameGán tên cho vùng văn bản. placeholdertext Cung cấp một trình giữ chỗ văn bản sẽ biến mất khi người dùng bắt đầu nhập vào vùng văn bản. readonlybooleanCho biết người dùng không thể sửa đổi nội dung của vùng văn bản. requiredbooleanCho biết người dùng phải điền vào biểu mẫu. rowsnumberChỉ định số cột văn bản được hiển thị theo mặc định cho vùng văn bản.

Phần kết luận

Thẻ HTML

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 được sử dụng để tạo các phần tử nhập văn bản nhiều dòng. Chúng có thể hữu ích nếu bạn muốn thu thập chuỗi dữ liệu dài hơn từ người dùng

Hướng dẫn này đã thảo luận, có tham khảo các ví dụ, cách sử dụng thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 để tạo vùng văn bản. Hướng dẫn này cũng cung cấp một bảng tham chiếu với các thuộc tính dành riêng cho thẻ được cung cấp bởi thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9. Bây giờ bạn đã sẵn sàng bắt đầu sử dụng thẻ

This text area is limited to just 10 characters
  
This text area is readonly and cannot be changed
 This value can't be changed 

9 như một chuyên gia HTML

1 Xếp hạng

Về chúng tôi. Career Karma là một nền tảng được thiết kế để giúp người tìm việc tìm kiếm, nghiên cứu và kết nối với các chương trình đào tạo việc làm để thăng tiến trong sự nghiệp của họ. Tìm hiểu về ấn phẩm CK

Bạn có thể sử dụng textarea làm đầu vào không?

Tại sao textarea không phải là đầu vào?

Đầu vào textarea có tồn tại trong HTML5 không?

Tôi nên sử dụng textarea hay input?