PgMaru

얼마 전에, HTML의 INPUT 태그 중에서 

Radio 버튼의 변경을 막는 방법을 알아보았는데,

이번에는 Select Box의 변경을 막아야 할 일이 생겼다.

그래서 검색을 해 보다가,

가장 쓸만하고 적절한 방법을 발견하게 되었다.

다음 블로그에서 발견한 내용이다.

http://senni.tistory.com/18

1
2

위와 같이, select 태그에 onfocus와 onchange를 추가하면,

옵션 선택을 변경하더라도 변경 내용이 적용되지 않는다.

onfocus와 onchange 이벤트를 적절히 활용해서, 

간단하게 한줄로 마무리하는 모습이 인상적이다.

HTML과 Javascript를 사용하면서 발견한 간단한 팁을 공유하고자 한다.

보통 HTML의 INPUT 태그의 직접 입력이나 변경을 방지하기 위해,

다음과 같이 readonly속성을 사용한다.

하지만, 유독 radio 버튼에 대해서는 이 readonly속성이 먹히지 않는다.

다음과 같이 해도, radio버튼을 클릭하면 선택이 바뀐다.

검색을 해보면 해결방법이 나오지만,

보다 간단한 해결책을 찾아내게 되었다.

<간단한 해결책>

<결과>