Computer >> Máy Tính >  >> Lập trình >> HTML

HTML DOM Input Email readOnly Thuộc tính

Thuộc tính HTML DOM Input Email readOnly đặt / trả về liệu Email nhập liệu có thể được sửa đổi hay không.

Cú pháp

Sau đây là cú pháp -

  • Trả về giá trị boolean - true / false
inputEmailObject.readOnly
  • Cài đặt readOnly sang booleanValue
inputEmailObject.readOnly = booleanValue

Giá trị Boolean

Đây, “booleanValue” có thể như sau -

booleanValue Chi tiết
true Nó xác định rằng trường email đầu vào là readOnly.
sai Nó xác định rằng trường email đầu vào không phải là readOnly và có thể được sửa đổi.

Ví dụ

Hãy để chúng tôi xem ví dụ về Chỉ đọc Email đầu vào tài sản -

<!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">Contact Us :
<input type="email" id="EmailSelect" onclick="showErrorMsg()" value="[email protected]" readOnly>
</label>
<input type="button" onclick="showMessage()" value="Copy Email Id">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputEmail = document.getElementById("EmailSelect");
   divDisplay.textContent = 'Above email is read-only';
   function showMessage() {
      inputEmail.select();
      document.execCommand('copy');
      divDisplay.textContent = 'Email Copied: '+inputEmail.value;
   }
   function showErrorMsg(){
      divDisplay.textContent +=', This cannot be edited.'
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Trước khi nhấp vào ‘Sao chép Id Email’ nút -

HTML DOM Input Email readOnly Thuộc tính

Nhấp vào ‘Liên hệ với chúng tôi Trường email -

HTML DOM Input Email readOnly Thuộc tính

Nhấp vào ‘Sao chép Id Email’ -

HTML DOM Input Email readOnly Thuộc tính