입력에 대한 "패턴"속성의 대체

Question

필드 검증을 추가하려는 웹 양식을 작성 중입니다. 나는 MDN에서 읽은대로

이

<input id="foo" class="span7" type="text" pattern="^[0-9]*\.?[0-9]*$"> 

그러나이 방법은 예기치 않은 동작, 그리고 모든 주요 브라우저에서 지원되지 않습니다있다 : 현재의 접근 방식은 다음과 같이 입력 태그의 "패턴"속성을 지정하고있었습니다. 이 기능의 대안이 있습니까?

텍스트 상자의 내용이 지정된 정규식과 일치하지 않으면 명확한 스타일을 적용하고 싶습니다. Jquery를 사용하여이 작업을 수행하고 클래스를 추가/제거 할 수 있다는 것을 알았지 만 이는 비효율적이라고 느낀다.

Answer 1

실제로는 효율적인 방법입니다. 당신은 pattern을 고용하거나 키 이벤트에 대해 자체 regex를 실행하는 고유 한 이벤트 리스너를 사용해야합니다.

Answer 2

이 시도 :

HTML :

<input id="foo" class="span7" type="text" onblur="checkInput(this.value,'^[0-9]*\.?[0-9]*$');"> 

자바 스크립트 :

<script> 
function checkInput(txt, pattern) { 
    var re = new RegExp(pattern); 
    var x = re.test(txt); 
    //--- if x != true then show error message 
} 
</script>