>웹 프론트엔드 >JS 튜토리얼 >숫자만 입력할 수 있는 jquery 기반 페이지 텍스트 상자 설정 구현 코드_jquery

숫자만 입력할 수 있는 jquery 기반 페이지 텍스트 상자 설정 구현 코드_jquery

WBOY
WBOY원래의
2016-05-16 18:07:37966검색

코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

$(" #money").bind ("propertychange",function() {
if(""!=this.value){
var str = this.value.replace(/(^s*)|(s *$)/g, "");
if(this.value != str )
this.value = str;
}
if( isNaN(Number(this.value)))
this.value = this.value.replace(/[D]/,'');
})

여기서 JQuery는 onpropertychange 이벤트에 바인딩하는 데 사용됩니다. 돈의 ID가 있는 텍스트 상자입니다.
아래 코드는 소수점까지 차단합니다
코드 복사 코드는 다음과 같습니다.

$("#phone").bind("propertychange", function() {
if(""!=this.value){
var str = this.value.replace(/(^ s*) |(s*$)/g, "");
if(this.value != str )
this.value = str;
}
if (this.value. indexOf(' .') != -1) {
this.value = this.value.replace(/[.]/, '')
this.focus() }
if ( isNaN(Number (this.value))) {
this.value = ($.trim(this.value)).replace(/[D]/, '');
this.focus(); } }) ;

마지막으로 입력방식을 차단하는 것이 가장 좋습니다. 이는 CSS, ime-mode:disabled를 통해 달성할 수 있습니다.
매우 엄격한 경우 붙여넣기 및 드래그 금지를 추가할 수 있습니다.
붙여넣기, 드래그 금지 방법
텍스트 상자에 드래그, 붙여넣기 금지

CSS 텍스트 상자에 드래그, 붙여넣기 금지 기능 구현

다음과 같이 CSS를 만듭니다.
코드를 복사합니다. 코드는 다음과 같습니다.

.TextBox_NotDragpaste

{
ondragenter:expression(ondragenter=function(){return false;})
onpaste:expression(onpaste=function(){return false;}); }

그래도 중국어 입력 기능을 비활성화해야 한다면 한 문장만 더 추가하면 됩니다.

은 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.
.TextBox_NotDragpaste

{
ime-mode:disabled;
ondragenter:expression(ondragenter=function(){return false;})
onpaste:expression(onpaste=function() {거짓 반환;} )
}

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.