2012-10-31 3 views
3

입력 상자에 text-transform : uppercase를 사용하고 있습니다. 그것은 태블릿 브라우저에서 지원되지 않습니다.텍스트 변환 CSS는 타블렛 브라우저에서 지원하지 않습니다.

<html> 
<body> 
<input type="text" class="isCapital"> 
</body> 
</html> 

그리고 CSS :

.isCapital{text-transform:uppercase;} 

사람이 이것에 대한 해결책을 가지고

여기 내 HTML입니다. 답을 업데이트하십시오.

답변

1

당신은이 :

      <!-- v--- this was misspelled --> 
<input type="text" class="isCaptial"> 

그것은해야한다 :

<input type="text" class="isCapital" /> 
+0

이 또한 작동합니다. Jai

+0

삼성 태블릿 브라우저에서 작동하지 않습니다. – Mathi

+0

@ Mathi 어떤 브라우저를 사용하고 있습니까? –

0

당신 맞춤법이 틀린 자본을.

isCaptialisCapital으로 바꿉니다.

+0

위대한 답변 Brian! – Jai

0

text-transform은 HTML 요소 콘텐츠의 일부가 아니므로 양식 필드 값에 영향을 미치지 않아야합니다. value 속성에 지정되었거나 사용자가 입력했는지 여부에 관계없이 실제로 테스트 한 브라우저 (Firefox, Chrome, IE, Opera on Win 및 Android)에서 값에 실제로 영향을주었습니다. 그러나 이러한 동작은 CSS 사양에 지정되어 있지 않습니다.

이렇게하면 데이터를 변환하는 것이 잠재적으로 혼란스럽고 오해의 소지가 있습니다. 사용자는 "foo"를 입력했지만 "FOO"를보고 양식 제출시 실제로 전송 된 데이터는 "foo"입니다.

실제로 페이지를 그런 식으로 동작 시키려면 브라우저 간 가장 많이 사용되는 방법은 문자를 대문자로 변환하지만 저장하는 JavaScript 코드 (text-transform 속성 외)를 사용하는 것입니다. 원본 입력뿐만 아니라 양식 제출을 가로 채기 때문에 실제 양식 대신 JavaScript 코드에 의해 작성된 원래 양식의 보이지 않는 사본으로 저장되지만 입력 된 데이터로 저장된 다른 양식은 제출됩니다.

0

나는 이것이 도움이 될지 의심 스럽지만 이것을 시도하고 싶습니까? 자바 스크립트/jQuery 사용 :

<script> 
jQuery(function(){ 
    jQuery(".isCapital").html().toUpperCase(); 
}); 
</script> 

해피 코딩!

관련 문제