2010-07-16 8 views
0

이것이 Chrome의 버그 일 수 있는지 잘 모르겠지만 뭔가 잘못하고 있습니다. 입력 한 내용이 숫자가 아닌 경우 텍스트 배경색을 빨간색으로 변경하려고합니다.Chrome의 자동 포커스에서 HTML5 양식 유효성 검사가 작동하지 않습니다.

나는이 HTML 페이지가 있습니다

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <title>iSPT</title> 
    <link rel="stylesheet" type="text/css" href="style2.css" /> 
</head> 
<body> 
    <form > 
     <input type="number" autofocus /> 
    </form> 
</body> 
</html> 

을 그리고 이것은 style2.css입니다 :

@CHARSET "ISO-8859-1"; 
:invalid{ 
    background-color: red; 
} 

이 (내가 문자를 입력하면 상자가 빨간색으로하지 않습니다) 위와 같이 작동하지 않습니다 . 내가 작동하도록 두 가지 방법이있다. 첫 번째는 입력에서 autofocus 속성을 제거했습니다.

또는 CSS를 HTML 헤드의 인라인 파일에서 가져온 경우 유효성 검사가 올바르게 작동합니다.

저는 오토 포커스와 외부 CSS 시트를 유지하고 싶습니다.

아이디어가 있으십니까?

+2

확실히 브라우저 버그 인 것 같습니다. 인라인 위에 외부 CSS가있을 때 다른 것이어야하는 이유는 없습니다. 검사관에서 보면 규칙이 적용되어야하고 DOM의 유효성 상태가 올바르게 설정되어있는 것으로 보입니다. – robertc

+0

현재 다른 브라우저에서 사용할 수있는 브라우저는 무엇입니까? – MrWhite

+0

Element Inspector에서이 스타일을 사용할 수 없도록 설정하고 즉시 활성화하면 페이지로 다시 전환됩니다 (원하는 경우 Element Inspector를 닫을 수 있습니다). 그러면 이제 작동합니다! 그래서 _something_ 처음에 _triggered_되지 않는 것 같습니다! – MrWhite

답변

0

Chrome의 최신 버전에서 해결 된 것으로 보입니다.