Thuộc tính readOnly của HTML DOM Input Email

Thuộc tính readOnly của đối tượng Input Email xác định xem trường email có chỉ đọc (không cho chỉnh sửa) hay không.

Cú pháp

Lấy giá trị (true/false)

inputEmailObject.readOnly

Thiết lập giá trị

inputEmailObject.readOnly = booleanValue

Giá trị Boolean

Ví dụ minh họa

Email hỗ trợ chỉ đọc, cho phép copy nhưng không sửa:

<!DOCTYPE html>
<html>
<head>
<title>Input Email readOnly</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>Email-readOnly</legend>
    <label for="EmailSelect">Liên hệ: <input type="email" id="EmailSelect" onclick="showErrorMsg()" value="infoHelpDesk@MNC.com" readOnly> </label>
    <input type="button" onclick="showMessage()" value="Copy Email">
    <div id="divDisplay"></div>
  </fieldset>
</form>
<script>
  var divDisplay = document.getElementById("divDisplay");
  var inputEmail = document.getElementById("EmailSelect");
  divDisplay.textContent = 'Email trên chỉ đọc';
  function showMessage() {
    inputEmail.select();
    document.execCommand('copy');
    divDisplay.textContent = 'Đã copy: ' + inputEmail.value;
  }
  function showErrorMsg(){
    divDisplay.textContent += ', Không thể chỉnh sửa.';
  }
</script>
</body>
</html>

Kết quả

Trường email hiển thị giá trị cố định. Click vào trường báo "Không thể chỉnh sửa". Nhấn "Copy Email" chọn và copy giá trị vào clipboard.