Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Thuộc tính isContentEditable trong HTML DOM

Thuộc tính isContentEditable trong HTML DOM trả về việc nội dung của một phần tử có thể được chỉnh sửa hay không.

Cú pháp

Trả về giá trị boolean - true/false:

HTMLElementObject.isContentEditable

Các giá trị Boolean

booleanValueMô tả
trueĐịnh nghĩa rằng nội dung của HTMLElementObject có thể chỉnh sửa.
falseĐịnh nghĩa rằng nội dung của HTMLElementObject không thể chỉnh sửa.

Ví dụ

Ví dụ minh họa thuộc tính isContentEditable:

<!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">Họ tên: <input type="text" id="textSelect" contentEditable="true" placeholder="John Doe"> </label><br> <label for="emailSelect">Email: <input type="email" id="emailSelect" placeholder="John@example.com"> </label> <input type="button" onclick="confirmtext()" value="Gửi"> <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>

Kết quả

Trước khi nhấn nút 'Gửi':

Thuộc tính isContentEditable trong HTML DOM

Sau khi nhấn nút 'Gửi':

Thuộc tính isContentEditable trong HTML DOM