Làm cách nào để bạn chỉ nhập số trong html?

Trong HTML, thẻ đầu vào có thể được đặt thành chỉ nhận các đầu vào số bằng cách đặt thuộc tính loại của nó thành số hoặc thành số điện thoại. Tuy nhiên, thực hiện nó thông qua JavaScript sẽ hơi phức tạp một chút

Nội dung chính Show

• Bước 1. Tài liệu HTML
• Bước 2. Thiết lập mã JavaScript
• Bước 3. Kiểm tra trường đầu vào
• Phần kết luận
• Select the quantity, and we cannot deliver more than 5.

Bước 1. Tài liệu HTML

Tạo tệp HTML và trong tệp đó, thiết lập trường nhập và một số văn bản yêu cầu người dùng nhập dữ liệu vào trường văn bản với sự trợ giúp của các dòng sau

< trung tâm >

< b >Enter Numbers hereb>

<br />

<input type="text" onkeypress="return checkNumber(event)" />

center>

Trong những dòng này

• Thuộc tính onkeypress của thẻ đầu vào đã được đặt thành giá trị trả về của phương thức checkNumber()
• Thuộc tính onkeypress được thực thi trên một sự kiện cụ thể đang xảy ra và sự kiện này xảy ra là một lần nhấn phím, vì vậy hãy chuyển sự kiện bên trong phương thức checkNumber()

Chạy trang web HTML bây giờ sẽ cho kết quả như sau trên trình duyệt

Hiện tại, tất cả các loại ký tự có thể được viết bên trong trường văn bản này

Nhưng điều này sẽ thay đổi trong phần tiếp theo

Bước 2. Thiết lập mã JavaScript

In the JavaScript file or in the

Số kiểm tra chức năng ( sự kiện ) {

var aCode = event.sự kiện nào ? . mà . sự kiện. Mã khoá;

nếu ( aMã . > 31 && (aCode < 48 || aMã > 57)) return false;

return true;

}

Như vậy là bạn đã hoàn tất việc thiết lập phần JavaScript

Bước 3. Kiểm tra trường đầu vào

Sau khi bạn hoàn thành bước 1 và bước 2, chỉ cần thực thi tài liệu HTML và thử đặt các giá trị bên trong trường đầu vào và quan sát hành vi của nó

Nó hiện chỉ cho phép viết số bên trong nó và bỏ qua các ký tự khác

Phần kết luận

Để hạn chế người dùng chỉ nhập các ký tự số bên trong đầu vào bằng JavaScript. Sau đó, trong trường hợp đó, hãy gọi một hàm trên mọi phím được nhấn bên trong trường nhập đó và trong hàm này, hãy so sánh mã ASCII của phím được nhấn với mã ASCII của các giá trị số. Dựa trên sự so sánh này, hãy cho phép nhập các phím bên trong trường nhập liệu

Trong bài viết này, chúng ta sẽ tìm hiểu cách giới hạn hộp nhập HTML để nó chỉ chấp nhận đầu vào số

Chúng tôi sử dụng để giới hạn hộp nhập HTML để nó chỉ chấp nhận đầu vào số. Bằng cách sử dụng này, chúng tôi sẽ nhận được một trường nhập số

cú pháp

Sau đây là cú pháp để giới hạn hộp nhập HTML để nó chỉ chấp nhận đầu vào số

Ví dụ

Sau đây là chương trình ví dụ để giới hạn hộp nhập HTML để nó chỉ chấp nhận đầu vào số -

   
   
   
   


   Tutorialspoint
   
      Enter your Mobile number -
       


      Enter your area Pincode -
       


      
   

Nếu chúng tôi cố gắng nhập bất kỳ giá trị nào ngoài số, nó sẽ không cho phép. Vì vậy, nó hoàn toàn chỉ cho phép các giá trị số

Ví dụ

Sau đây là một chương trình ví dụ khác để giới hạn hộp nhập HTML để nó chỉ chấp nhận đầu vào số -

   
   
   


   
      Phone Number:
      

      
   

Sau khi giới hạn hộp nhập liệu thành số, nếu người dùng nhập văn bản và nhấn nút gửi, thì có thể thấy thông báo sau “Vui lòng nhập số. ”

Chúng tôi cũng có thể giới hạn giá trị của trường nhập số

Sau khi giới hạn hộp đầu vào thành số, nếu người dùng nhập lớn hơn giới hạn và nhấn nút gửi, thì có thể thấy thông báo sau “Giá trị phải nhỏ hơn hoặc bằng giá trị giới hạn được chỉ định (20)”

Ví dụ

Sau đây là một chương trình ví dụ khác để giới hạn hộp nhập HTML để nó chỉ chấp nhận đầu vào số -

   
   
   


   
      
Select the quantity, and we cannot deliver more than 5.


      Pizza

      Burger

      Garlic Bread

      Pepsi

   

Nếu bạn biên dịch và chạy đoạn mã trên, nó sẽ hiển thị 4 hộp và bạn có thể đặt giới hạn từ tối thiểu 0 đến tối đa 5