Thuộc tính type của HTML DOM Input Text

Thuộc tính type của đối tượng Input Text trong HTML DOM trả về hoặc thiết lập kiểu của ô nhập liệu. Mặc dù đối tượng là Input Text, nhưng ta có thể thay đổi type thành email, radio, tel, v.v. thông qua JavaScript.

Cú pháp

Lấy giá trị type

inputTextObject.type

Thiết lập type

inputTextObject.type = 'giá_trị_chuỗi'

Các giá trị chuỗi phổ biến

Ví dụ minh họa

Ví dụ dưới đây hiển thị loại ô nhập liệu hiện tại khi nhấn nút:

<!DOCTYPE html>
<html>
<head>
<title>Input Text type</title>
<style>
  form { width: 70%; margin: 0 auto; text-align: center; }
  * { padding: 2px; margin: 5px; }
  input[type="button"] { border-radius: 10px; }
</style>
</head>
<body>
<form>
  <fieldset>
    <legend>Text-type</legend>
    <label for="TextSelect"></label> 
    <input type="text" id="TextSelect" > 
    <input type="button" onclick="getTypeOfInput()" value="Loại nhập liệu?"> 
  </fieldset> 
</form> 
<script> 
  var labelSelect = document.querySelector("label"); 
  var inputText = document.getElementById("TextSelect"); 
  function getTypeOfInput() { 
    labelSelect.innerHTML = ' Loại: ' + inputText.type + ': '; 
  } 
</script> 
</body> 
</html>

Kết quả

• Ban đầu: label trống.
• Sau khi nhấn nút: label hiển thị "Loại: text:" (vì mặc định là text).

Lưu ý: Việc thay đổi type động qua JS có thể không được hỗ trợ hoàn hảo trên một số trình duyệt cũ (đặc biệt là IE). Khuyến khích khai báo đúng type ngay trong HTML.