Javascript를 사용하여 HTML5의 필수 속성을 설정하는 방법은 무엇입니까?

Question

Javascript에서 text입력 상자를 필수로 표시하려고 합니다.

으아아아

필드가 원래 표시된 경우 required:

으아아아

사용자가 제출하려고 하면 다음과 같은 유효성 검사 오류가 발생합니다.

하지만 이제 Javascript를 통해 "런타임"에 required 속성을 설정하고 싶습니다.

으아아아

해당 스크립트 사용:

으아아아

지금 제출하지 않으면 유효성 검사나 차단이 없습니다.

HTML5 유효성 검사 부울 속성을 설정하는 올바른 방법은 무엇인가요?

jsFiddle

이 부동산의 가치는 얼마입니까?

HTML5 유효성 검사

부울로 문서화된 속성: required 属性记录为 Boolean

4.10.7.3.4 속성required

required 속성은 부울 속성입니다. 지정된 경우 이 요소는 필수입니다.

속성을 정의하는 방법에 대해 귀찮은 점이 많습니다. HTML5 사양 설명:

boolean

요소에 부울 속성이 있으면 참 값을 나타내고, 이 속성이 없으면 거짓 값을 나타냅니다.

속성이 있는 경우 해당 값은 빈 문자열이거나 속성의 정식 이름과 일치하고 앞뒤 공백이 없는 ASCII 대소문자 구분 값이어야 합니다.

즉, 두 가지 방법으로

booleanrequired 속성을 지정할 수 있다는 의미입니다. 으아아아 그러나 실제로

속성의 값

은 무엇입니까? 이 질문에 대한 내 jsFiddle을 보면

속성이 마크업에 정의되어 있는 경우를 알 수 있습니다.

으아아아 required그러면 속성

의 값은 빈 문자열도 아니고 속성의 표준 이름도 아닙니다. 으아아아 이렇게 하면 해결 방법이 나타날 수 있습니다.

Answer 1

required 是一个反射属性 （例如 id、name、type 등) 따라서:

으아악

...여기서 element 是实际的 input DOM 요소, 예:

으아악

---

(완전성을 위해)

답글:

그 이유는 해당 코드의 required 是一个属性对象，而不是字符串； 属性是NamedNodeMap 其值为 Attr代码>对象。要获取其中之一的值，您需要查看其 value 속성 때문입니다. 그러나 부울 속성의 경우 값은 관련이 없습니다. 속성이 맵에 있거나(true) 없거나(false) 있습니다.

따라서 required이 반영되지 않은 경우 속성을 추가하여 설정할 수 있습니다.

으아악

...element.required = true와 동일합니다. 완전히 삭제하면 지울 수 있습니다:

으아악

...element.required = false와 동일합니다.

하지만 이미 반영되었기 때문에 required에는 그렇게 할 필요가 없습니다.

Answer 2

짧은 버전

으아악

긴 버전

T.J. Crowder가 반사 속성을 지적한 후 다음 구문 error을 배웠습니다.

으아악

당신은 반드시 통과해야 합니다 element.getAttribute和element.setAttribute:

으아악

이것은 속성에 실제로 특별한 HtmlAttribute 개체가 포함되어 있기 때문입니다.

으아악

속성 값을 "true"로 설정하면 필요한 HtmlAttribute 개체 대신 String 개체로 실수로 설정하게 됩니다.

으아악

개념적으로 올바른 개념(유형 언어로 표현)은 다음과 같습니다.

으아악

이유는 다음과 같습니다.

• getAttribute(名称)
• setAttribute(名称, 值)

존재. 내부 HtmlAttribute 개체에 값을 할당하는 일을 담당합니다.

또한 일부 속성을 반영합니다. 즉, Javascript를 통해 더 나은 접근이 가능하다는 뜻입니다:

으아악

당신이 하지 하고 싶지 않은 것은 .attributes컬렉션을 잘못 사용하는 것입니다:

으아악

테스트 사례

이는 required 속성 사용에 대한 테스트로 이어지며, 해당 속성을 통해 반환된 값을 반영된 속성과 비교합니다.

으아악

결과:

으아악

.attributes 컬렉션에 직접 액세스하려는 시도는 오류입니다. DOM 속성을 나타내는 객체를 반환합니다:

으아악

이는 .attributes 컬렉션과 직접 대화하면 안 되는 이유를 설명합니다. 속성의 값을 조작하는 것이 아니라 속성 자체를 나타내는 객체를 조작하는 것입니다.

필수 항목은 어떻게 설정하나요?

속성에 required를 설정하는 올바른 방법은 무엇인가요? 반영된 속성 또는 속성을 올바르게 설정하는 두 가지 옵션이 있습니다.

으아악

엄밀히 말하면 다른 값은 속성을 "설정"합니다. 그러나 Boolean 속성의 정의에 따르면 Boolean 属性的定义规定，只能将其设置为空字符串 "" 来指示 true。以下方法都可以设置requiredtrue를 나타내기 위해 빈 문자열 ""로만 설정할 수 있습니다. 다음 메소드는 set

Boolean속성을

할 수 있습니다.

하지만

사용하지 마세요

: 으아악 우리는 속성을 직접 설정하는 것이 실수라는 것을 배웠습니다.

으아악

필수 입력란을 삭제 하는 방법은 무엇인가요? required

제거

속성을 시도할 때의 요령은 실수로 열리기 쉽다는 것입니다. .required 으아악

잘못된 방법:

으아악 reflection의 속성을 사용할 때 "falsey" 값을 사용하여 끄고 true 값을 사용하여 켤 수도 있습니다. 그러나 명확성을 위해 옳고 그름을 고수하십시오. 必需

어떻게

확인.hasAttribute("required") 있는지

?

메소드를 통해 속성이 존재하는지 확인하세요: .required 으아악

또한 🎜Boolean🎜 반영된 🎜 속성을 통해 확인할 수도 있습니다. 🎜 으아악