[js] JS - readOnly 속성 - INPUT 텍스트 읽기전용 설정/반환 (= readOnly속성 = 리드온리속성) ※ 인풋 리드온리 속성

목차

1. readOnly 예제 - INPUT 텍스트 읽기전용 설정
2. readOnly 정의
3. readOnly 구문
4. readOnly 예제 - INPUT 텍스트 읽기전용 반환

readOnly 예제 - INPUT 텍스트 읽기전용 설정

 

사이트: <input type="text" id="hz">

<button onclick="homzzang()">클릭</button>

<script>

function homzzang() {

  document.getElementById("hz").readOnly = true;

}

</script>

 

결과보기

readOnly 정의

 

해당 INPUT 텍스트 필드가 읽기전용인지 여부 설정/반환.

 

---

 

1.

• 읽기 전용 필드는 수정불가. (단, 사용자는 탭하여 강조 표시하고 텍스트를 복사 가능.)
• 사용자가 INPUT 텍스트 필드와 상호작용 못 하게 하려면, disabled 속성 사용.

 

2.

모든 브라우저 지원.

 

readOnly 구문

 

반환

textObject.readOnly

 

설정

textObject.readOnly = true|false

 

---

[속성값]

 

true|false

읽기전용 속성 사용 여부

• true - 읽기전용 속성 사용 O
• false - 읽기전용 속성 사용 X

 

---

[반환값]

 

• readonly 속성 사용 O 경우, true 반환.
• readonly 속성 사용 X 경우, false 반환.

 

readOnly 예제 - INPUT 텍스트 읽기전용 반환

 

사이트: <input type="text" id="hz" readonly>

<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>

function homzzang() {

  var x = document.getElementById("hz").readOnly;

  document.getElementById("demo").innerHTML = x;

}

</script>

 

결과보기