자바 스크립트에서 텍스트 상자에 값을 추가하여 Android 기본 브라우저에서 작동하지 않습니다.

Question

전화 번호를 구현하려고합니다. 모바일 웹 사이트 마스킹. jquery mask plugin을 디바이스에서 제대로 작동하지 않기 때문에 사용할 수 없습니다. 아래의 구현은 Android Chrome 모바일 브라우저에서 정상적으로 작동합니다. 그러나 Android 기본 브라우저의 경우 백 스페이스 키를 사용하여 모든 숫자를 삭제하려고하면 마지막으로 (2/3) 숫자/자릿수가 지워지지 않습니다. 내 생각 엔 this.value + = "-";이 일부 텍스트 상자 속성을 업데이트하지 않습니다. 전화 번호 형식 (예 : ###. - ### - ####)입니다

HTML

<input id="phoneNo" type="tel" maxlength="12" placeholder="Phone"/> 

자바 스크립트

var phoneNo = document.getElementById("phoneNo"); 
phoneNo.addEventListener("textInput",function(){ 
if(this.value.toString().length==3 || this.value.toString().length==7) { 
    this.value += "-";    
} 
}); 

Answer 1

는 jQuery를에서보세요 on() 메서드는 모든 브라우저가 addEventListener를 지원하지 않기 때문에 문제가 무엇인지 추측하고 있습니다.

http://api.jquery.com/on/

Answer 2

씨 DARSHAN 또한 내가 이러한 종류의 기능을 사용하고 내 응용 프로그램에서 http://jsfiddle.net/2dJAN/51/

살펴 보시기 바랍니다. "-"당신은 필드 내 모든 숫자를 삭제할 수 있습니다

형식 123-456-7890 같은 숫자 사이에이 예를

1. 는 사용자가이 자동으로 추가됩니다 필드
2. 만 정수를 입력 할 수 있습니다.

   $("#fax_field").on("keyup", function(event) { 
        var limitField = $(this).val().trim().length; 
        var limit = "12" 
        this.value = this.value.replace(/[^0-9_\-\.]/g, ''); 
        if (event.keyCode != 8) { 
         if (limitField == 3) { 
         var fax_value = $(this).val().trim().concat('-'); 
         $("#fax_field").val(fax_value); 
         } else if (limitField == 7) { 
         var fax_value = $(this).val().trim().concat('-'); 
         $("#fax_field").val(fax_value); 
         } 
        } 
        if (limitField > limit) { 
         $("#fax_field").val($(this).val().trim().substring(0, limit)); 
        } 
       }); 
   

이 시도하십시오. 당신의 의견을 알려주십시오.