이 기사는 JavaScript에서 HTML DOM Input Checkbox 'disabled' 속성의 목적, 작동 및 사용법을 설명합니다.
HTML DOM 입력 확인란 '비활성화' 속성은 JavaScript에서 어떻게 작동합니까?
입력 확인란 ' 장애가 있는 ” 속성은 “checkbox” 속성에 따라 다릅니다. HTML 양식 및 입력 필드에서 작동하여 주어진 확인란을 비활성화 및 비활성화합니다.
구문(비활성화 속성 설정)
checkbox객체. 장애가 있는 = 진실 | 거짓정의된 반환 구문에 따라 'disabled' 속성은 다음과 같은 두 개의 매개 변수를 지원합니다.
- 진실: 해당 체크박스가 비활성화되었음을 나타냅니다.
- 거짓(기본값): 연결된 확인란이 비활성화되지 않았음을 나타내는 선택적 값입니다.
반환(비활성 속성 반환)
checkbox객체. 장애가 있는위 구문에서 ' 체크박스객체 '는 HTML '에 해당합니다. 확인란 ' 요소.
아래 예제에서 위에 정의된 구문을 활용하여 'disabled' 속성의 실제 구현을 이해해 봅시다.
예제 1: 입력 체크박스 'disabled' 속성 적용 기본 구문 사용
첫 번째 예에서는 정의된 일반 구문을 사용하여 비활성화하기 위해 '확인란'이 추가되었습니다.
HTML 코드
먼저 주어진 HTML 코드를 분석합니다.
< 바디 스타일 = '텍스트 정렬: 가운데' >
< h2 > HTML DOM 입력 체크박스 JavaScript의 비활성화 속성 h2 >
체크박스 : < 입력 유형 = '확인란' ID = '데모' > 제출된 양식 < br >< br >
< 피 > 지정된 확인란이 비활성화되어 있습니다. 피 >
위의 코드 라인에서:
- “ <몸> ' 태그는 '에 정렬되는 본문 섹션을 지정합니다. 센터 ”의 도움으로 스타일 ' 기인하다.
- “ ” 태그는 레벨 2의 부제목을 정의합니다.
- “ <입력> ” 태그는 입력 유형을 지정하여 “확인란”을 생성합니다. 확인란 ' 할당된 ID가 있는 ' 데모 '.
- “ ” 태그는 결과 결과를 표시하는 단락 요소를 추가합니다.
자바스크립트 코드
다음으로 JavaScript 코드를 살펴보십시오.
< 스크립트 >문서. getElementById ( '데모' ) . 장애가 있는 = 진실 ;
스크립트 >
위 코드 스니펫에서 ' document.getElementById() ” 메서드는 id “demo”를 사용하여 확인란을 가져오는 데 적용되며 “disabled” 속성 값은 “ 진실 ” 확인란을 비활성화합니다.
산출
위의 출력은 ' 장애가 있는 ” 속성이 “로 설정됨 진실 '.
예 2: 입력 체크박스 'disabled' 속성 값 반환
이 예제는 'disabled' 속성을 적용하여 대상 체크박스의 상태를 부울 값(true/false)으로 반환합니다.
HTML 코드
다음 HTML 코드를 고려하십시오.
< 바디 스타일 = '텍스트 정렬: 가운데' >< h2 > HTML DOM 입력 체크박스 JavaScript의 비활성화 속성 h2 >
체크박스 : < 입력 유형 = '확인란' 장애가 있는 = 진실 ID = '데모' > 제출된 양식 < br >< br >
< 아이디 = '견본' > 피 >
위의 코드 블록에서:
- 확인란이 할당되고 ' 장애가 있는 ” 속성이 “로 설정됨 진실 '.
- 그 후 빈 ' ” 요소는 할당된 ID 'sample'과 함께 추가되어 출력을 추가합니다.
자바스크립트 코드
이제 JavaScript 코드로 이동합니다.
< 스크립트 >~이있다 = 문서. getElementById ( '데모' ) . 장애가 있는 ;
문서. getElementById ( '견본' ) . innerHTML = ㅏ ;
스크립트 >
위의 코드에서:
- 변수 ' ㅏ '는 '를 활용한다. document.getElementById() ” 메서드를 사용하여 ID “demo”를 사용하여 체크박스에 액세스하고 “ 장애가 있는 ” 속성을 사용하여 가져온 확인란이 비활성화되었는지 여부를 확인합니다.
- 다시 적용된 'document.getElementById()' 메서드는 포함된 빈 단락을 가져와 'disabled' 속성의 상태를 단락으로 표시합니다.
산출
분석된 대로 결과는 '체크박스' 할당 상태, 즉 ' 진실 '.
예 3: 입력 확인란 'disabled' 속성을 사용하여 확인란 비활성화 및 비활성화 해제
확인란 상태를 설정하고 반환하는 것 외에도 '비활성화' 속성을 사용하면 사용자가 확인란을 동시에 비활성화 및 비활성화할 수 있습니다. 실전에서 봅시다.
HTML 코드
작성된 HTML 코드를 검토해 보겠습니다.
< 바디 스타일 = '텍스트 정렬: 가운데' >< h2 > HTML DOM 입력 체크박스 JavaScript의 비활성화 속성 h2 >
체크박스 : < 입력 유형 = '확인란' ID = '데모' > 제출된 양식 입력 >< br >< br >
< 버튼 클릭 = '체크비활성화()' > 확인란 비활성화 단추 >
< 버튼 클릭 = 'checkUndisable()' > 확인란 비활성화 단추 >
위의 코드 블록에서:
- 마찬가지로 체크박스를 포함하고 ' 온 클릭 '를 실행하는 이벤트 체크비활성화() ”버튼 클릭시 기능.
- 그 후 'onclick' 이벤트 핸들러를 사용하는 두 번째 버튼이 추가됩니다. 체크 해제() ” 버튼을 클릭하면 작동합니다.
자바스크립트 코드
다음으로 아래에 명시된 코드를 살펴보십시오.
< 스크립트 >기능 확인 비활성화 ( ) {
문서. getElementById ( '데모' ) . 장애가 있는 = 진실 ;
}
기능 확인 비활성화 해제 ( ) {
문서. getElementById ( '데모' ) . 장애가 있는 = 거짓 ;
}
스크립트 >
위의 코드 라인에서:
- '라는 함수를 정의합니다. 체크비활성화() '는 '를 적용합니다. document.getElementById() ” 메서드는 ID “demo”를 통해 확인란에 접근하고 해당 값을 “true”로 설정합니다.
- 두 번째 기능 ' 체크 해제() ' 함수는 다시 'document.getElementById()' 메서드를 적용하여 체크박스에 다시 액세스하고 사용자가 'Undisable the checkbox'라는 포함된 두 번째 버튼을 클릭하면 해당 값을 'false'로 설정합니다.
산출
출력은 사용자가 첫 번째 버튼을 클릭하면 지정된 확인란을 '비활성화'하고 그에 따라 사용자가 두 번째 버튼을 클릭하면 '비활성화'합니다.
결론
자바스크립트에서 HTML DOM 입력 체크박스 ' 장애가 있는 ” 속성은 사용자가 “확인란”의 체크 상태를 설정하고 반환하도록 도와줍니다. 'set' 및 'return' 프로세스 모두에 대한 일반화된 구문을 정의합니다. 설정 구문은 두 값 ' 진실 ' 그리고 ' 거짓 '. 반면 반환 구문에는 매개 변수가 필요하지 않습니다. 이 기사에서는 JavaScript에서 HTML DOM Input Checkbox 'disabled' 속성의 객관적이고 작동하며 실용적인 구현을 보여주었습니다.