>웹 프론트엔드 >JS 튜토리얼 >JavaScript를 사용하여 HTML 입력 요소에서 '비활성화' 속성을 제거하는 방법은 무엇입니까?

JavaScript를 사용하여 HTML 입력 요소에서 '비활성화' 속성을 제거하는 방법은 무엇입니까?

WBOY
WBOY앞으로
2023-08-31 13:17:02720검색

如何使用 JavaScript 从 HTML 输入元素中删除“禁用”属性?

HTML에서는 입력 요소를 사용하여 양식을 만들거나 다른 방식으로 사용자로부터 입력을 받을 수 있습니다. 체크박스, 라디오 버튼, 텍스트, 숫자 등과 같은 다양한 유형의 입력 요소가 있습니다.

모든 요소에 'disabled' 속성을 사용하여 입력 필드를 비활성화하고 사용자가 입력 요소와 상호 작용하는 것을 중지할 수 있습니다. 어떤 경우에는 JavaScript를 사용하여 비활성화된 속성을 추가하고 제거해야 합니다. 예를 들어, 나이가 18세 이상인 사용자의 팬 카드 번호를 가져오려고 합니다. 따라서 JavaScript에서 비활성화된 속성을 제거하여 사용자가 18세 이상의 나이를 입력하는 경우에만 팬 카드 입력 필드를 활성화해야 합니다.

여기에서는 JavaScript를 사용하여 HTML 입력 요소에서 비활성화된 속성을 제거하는 다양한 접근 방식을 알아봅니다.

removeAttribute() 메소드 사용

첫 번째 접근 방식에서는 제거 속성() 메서드를 사용하여 비활성화된 속성을 제거합니다. 이는 메소드의 매개변수로 전달되는 HTML 요소에서 모든 속성을 제거하는 데 사용됩니다.

구문

사용자는 아래 구문에 따라 RemoveAttribute() 메서드를 사용하여 입력 요소에서 'disabled' 속성을 제거할 수 있습니다.

으아아아

위 구문에서는 'disabled'인 속성 이름을 메서드의 매개 변수로 전달했습니다.

아래 예에서는 HTML 부분에 텍스트 입력 필드를 정의했습니다. 사용자가 버튼을 클릭할 때마다 RemoveDisabled() 함수가 호출됩니다.

remvoeDisabled() 함수에서는 ID로 입력 요소에 액세스합니다. 그런 다음 입력 요소를 참조로 사용하고 'disabled'를 매개변수로 전달하여 RemoveAttribute() 메서드를 실행합니다.

출력에서 사용자는 버튼을 클릭하기 전에는 입력 요소와 상호작용할 수 없지만 버튼을 클릭한 후에는 상호작용할 수 있음을 관찰할 수 있습니다.

으아아아

'비활성화' 속성 수정

이 접근 방식에서는 HTML 요소에서 비활성화된 속성을 제거하는 대신 '비활성화' 속성의 값을 수정합니다. 'disabled' 속성은 부울 값을 사용합니다. 비활성화된 속성의 기본값은 'true'이지만 'false'로 설정할 수 있으며 입력 요소에서 'disabled' 속성을 제거하는 것과 동일하게 작동합니다.

구문

사용자는 아래 구문에 따라 비활성화된 속성의 값을 false로 수정할 수 있습니다.

으아아아

예 1

아래 예에서는 기본적으로 모두 비활성화된 여러 개의 텍스트 입력 요소를 만들었습니다. JavaScript에서는 모든 입력 요소에 액세스하고 forEach() 메서드를 사용하여 입력의 노드 목록을 반복합니다. forEach() 메서드 내에서 각 입력의 비활성화된 속성 값을 false로 수정합니다.

출력에서 사용자는 버튼을 클릭한 후 모든 입력 요소가 다루기 힘든 것을 확인할 수 있습니다.

으아아아

예 2

아래 예에서는 여러 개의 체크박스 입력을 생성하고 모든 체크박스에 비활성화된 속성을 추가하여 비활성화했습니다. RemoveDisable() 함수에서는 모든 체크박스에 접근하고 각 체크박스의 'disabled' 속성을 수정합니다.

으아아아

JavaScript를 사용하여 입력 요소에서 비활성화된 속성을 제거하는 방법을 배웠습니다. 첫 번째 접근 방식에서는 입력 요소에서 비활성화된 속성을 제거하는 RemoveAttribute() 메서드를 사용했습니다. 두 번째 요소에서는 비활성화된 속성의 값을 HTML 요소에서 제거하는 대신 수정하지만 입력 요소 활성화라는 목표를 달성할 수 있습니다.

위 내용은 JavaScript를 사용하여 HTML 입력 요소에서 '비활성화' 속성을 제거하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 tutorialspoint.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제