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

Thuộc tính HTML DOM isContentEditable

Thuộc tính HTML DOM isContentEditable trả về nội dung của một phần tử 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

HTMLElementObject.isContentEditable

Giá trị Boolean

Đây, “booleanValue” được trả lại -

booleanValue Chi tiết
true Nó xác định rằng nội dung của HTMLElementObject có thể chỉnh sửa được.
sai Nó xác định rằng nội dung của HTMLElementObject không thể chỉnh sửa được.

Ví dụ

Hãy để chúng tôi xem một ví dụ cho isContentEditable tài sản -

<!DOCTYPE html>
<html>
<head>
<title>isContentEditable</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>isContentEditable</legend>
<label for="textSelect">Full Name:
<input type="text" id="textSelect" contentEditable="true" placeholder="John Doe">
</label><br>
<label for="emailSelect">Email:
<input type="email" id="emailSelect" placeholder="[email protected]">
</label>
<input type="button" onclick="confirmtext()" value="Submit">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputText = document.getElementById("textSelect");
   var inputEmail = document.getElementById("emailSelect");
   divDisplay.textContent = 'NOTE: Email will be not editable once submitted';
   function confirmtext() {
      inputEmail.disabled = !inputEmail.isContentEditable;
      inputText.disabled = !inputText.isContentEditable;
      divDisplay.textContent = 'Details Submitted';
   }
</script>
</body>
</html>

Đầu ra

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

Trước khi nhấp vào nút 'Gửi' -

Thuộc tính HTML DOM isContentEditable

Sau khi nhấp vào nút 'Gửi' -

Thuộc tính HTML DOM isContentEditable