메뉴 건너뛰기

프로그램언어

조회 수 93 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄 첨부

readonly와 disabled

readonly와 disabled은 공통적으로 input 태그를 사용자가 입력 및 수정을 못하게 비활성화하는 방법으로 사용된다.
같은 목적으로 사용되지만 분명한 차이점이 있습니다.

 

readonly

 

 

· form submit 가능
· input과 textarea에서 사용가능

 

disabled

 

 

<input type="text" value="disabled" disabled>

· form submit 불가능
· button, optgroup, option, select, input, textarea에서 사용가능

 

자바스크립트, 제이쿼리로 readonly, disabled 적용하기

· javascript로 readonly, disabled 적용하기

<script>
    document.getElementById('ID')disabled = true;
    document.getElementById('ID').disabled = false;

    document.getElementById('ID').readOnly = true; 
    document.getElementById('ID').readOnly = false;
</script>

· jQuery로 readonly, disabled 적용하기

<script>
    $('#ID').attr("readonly" true);
    $('#ID').attr("readonly" false);

    $('#ID').attr("disabled" true);
    $('#ID').attr("disabled" false);
</scirpt>

 

readonly와 disabled 사용하기

<input type="text" value="readonly" readonly>
<input type="text" value="disabled" disabled>

 

 

readonly 와 disabled의 차이는

시각적인 차이도 있지만, form submit으로 값을 보낼때 disabled의 값은 전송되지 않는 점 인것같다.
어찌보면 단순한 차이지만...몰라서 한참을 고생했다..

만약 disabled의 값을 submit 시켜야한다면 hidden 속성을 가진 input을 만들어서 넘기는 방법을 사용해야 하는것 같다.

 


List of Articles
번호 제목 날짜 조회 수
22 HTML 특수문자 / 띄어쓰기,공백, 따옴표 2023.01.27 2199
» input 속성 readonly, disabled 차이점 file 2023.01.27 93
20 Input 태그 한글, 영문모드 전환 2023.01.12 248
19 MSword : 인쇄 미리보기-한페이지씩 보이기 2021.03.26 301
18 map태그에서 window.open() 쓰기 2021.03.26 201
17 input태그 tab 순서 설정 : tabindex 2021.03.26 357
16 인라인 자동완성 기능 막기 2021.03.25 129
15 javascript로 alt 또는 title 달때 내용에 포함된 따옴표 치환하기 2021.03.25 166
14 HTML - Form 태그, Input 태그 자동완성 해제하기 2021.03.09 152
13 CSS - p태그 등 너무 긴 문자열이 존재할 때, 넓이에 따른 자동 줄바꿈 file 2021.03.09 590
12 HTML - Table td안에 특수문자(")가 존재할 경우 넓이 초과 현상 file 2021.03.09 247
11 HTML, CSS - 헤더컬럼 고정형 table 구성하기 file 2021.03.09 737
10 크롬 알림처럼 띄워보기 file 2019.04.29 845
9 네이버 웹마스터도구 메타태그 2019.04.29 787
8 div iframe 퍼센트 높이조절 문제 해결(div, iframe height 100%) file 2019.03.05 1003
7 input 자동완성 끄기 HTML file 2019.02.19 1090
6 테이블 대신 필드셋(fieldset) 이용 2019.01.16 2122
5 FCKeditor 2.6.x 버전 IE9에서의 Dialog 버그 수정 2018.10.27 1166
4 form안의 button submit 동작 막기 2018.08.24 1723
3 viewport meta 태그를 이용해 모바일 브라우저상에서 레이아웃 조종하는 법 file 2017.04.14 6865
Board Pagination Prev 1 2 Next
/ 2

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved