HTML DOM Input Tel readOnly Property

Last Updated : 29 Aug, 2022

The DOM Input tel readOnly property is used to set or return whether the tel field should be read-only or not. It means that a user cannot modify or changes the content already present in a particular element (However, a user can tab to it, highlight it, and copy the text from it) whereas a JavaScript can be used to change the read-only value and make the input field editable.

Syntax:

It is used to return the readOnly property.

telObject.readOnly

It is used to set the readOnly property.

telObject.readOnly = true|false

Property Values:

true: It defines that the input tel field is read-only.
false: It is the default value. It defines that the tel field is not read-only.

Return Value: It returns a boolean value that represents whether the tel field is read-only or not.

Example: This example illustrates how to return the input tel readOnly property.

HTML

<!DOCTYPE html>
<html>
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
    <h2> DOM Input Tel readOnly property </h2>
    <input type="tel" id="mytel"
        value="6753682635" readonly>
    <br><br>
    <button onclick="check()">
        check!
    </button>
    <p id="demo" style="font-size:25px"></p>
 
    <script>
        function check() {
            var x = document.getElementById("mytel").readOnly;
            document.getElementById("demo").innerHTML = x;
        }
    </script>
</body>
</html>