[JS] disabled, readonly 사용법과 차이점

사용법

disabled 와 readonly 는 input 박스에서 사용자가 값을 입력 및 수정을 할 수 없게 하는 속성이다.

<input type="text" id="test" name="test" value="1234">

제이쿼리(jQuery)

$("#test").attr("disabled",true);
$("#test").attr("disabled",false);

$("#test").attr("readonly",true);
$("#test").attr("readonly",false);

자바 스크립트(javascript)

document.getElementById('test').disabled = true;
document.getElementById('test').disabled = false;

document.getElementById('test').readOnly = true; 
document.getElementById('test').readOnly = false;

구현된 화면 : none - disabled - readonly

---

차이점

<form>  태그 사용 시

readonly 는 input 박스 value 값을 form 전송이 가능하지만

disabled 는 input 박스 value 값을 form 전송 시 값이 전달되지 않는다.