Rumah > hujung hadapan web > tutorial js > jquery mengehadkan kotak teks kepada hanya memasukkan nombor (integer dan perpuluhan)_jquery

jquery mengehadkan kotak teks kepada hanya memasukkan nombor (integer dan perpuluhan)_jquery

WBOY
Lepaskan: 2016-05-16 15:21:07
asal
1132 orang telah melayarinya

Contoh dalam artikel ini memperkenalkan kod terperinci jquery yang mengehadkan kotak teks hanya untuk memasukkan nombor untuk rujukan anda. Kandungan khusus adalah seperti berikut

Pertama, berikut ialah kod jQuery yang menetapkan bahawa kotak teks hanya boleh memasukkan nombor termasuk perpuluhan:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="gb2312"> 
<title>脚本之家</title> 
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
//文本框只能输入数字(包括小数),并屏蔽输入法和粘贴 
jQuery.fn.number=function(){
 this.bind("keypress",function(e){ 
 var code=(e.keyCode&#63;e.keyCode:e.which); //兼容火狐 IE 
 //火狐下不能使用退格键 
 if(!$.browser.msie&&(e.keyCode==0x8)){return;} 
 if(this.value.indexOf(".")==-1){return (code >= 48 && code<= 57)||(code==46);}
 else{return code >= 48 && code<= 57} 
 }); 
 this.bind("paste",function(){return false;}); 
 this.bind("keyup",function(){
 if(this.value.slice(0,1) == ".")
 { 
  this.value = ""; 
 } 
 }); 
 this.bind("blur",function(){ 
 if(this.value.slice(-1) == ".")
 { 
  this.value = this.value.slice(0,this.value.length-1); 
 } 
 }); 
}; 
$(function(){ 
 $("#txt").number();
}); 
</script>
</head>
<body>
<input type="text" id="txt" />
</body>
</html>
Salin selepas log masuk

2. Cara jQuery menetapkan bahawa kotak teks hanya boleh memasukkan integer: Kadang-kadang kandungan kotak teks hanya boleh menjadi nombor, dan ia hanya boleh menjadi integer Contohnya, untuk umur, anda tidak boleh mengisi 20.8 tahun Berikut adalah contoh kod untuk melaksanakan fungsi ini bantu rakan yang memerlukan. Kod seperti berikut:

<html> 
<head> 
<meta charset="gb2312"> 
<title>蚂蚁部落</title> 
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
//文本框只能输入数字(不包括小数),并屏蔽输入法和粘贴 
jQuery.fn.integer=function(){ 
 this.bind("keypress",function(e){ 
 var code=(e.keyCode&#63;e.keyCode:e.which); //兼容火狐 IE 
 //火狐下不能使用退格键 
 if(!$.browser.msie&&(e.keyCode==0x8))
 { 
  return ; 
 } 
 return code >= 48 && code<= 57; 
 }); 
 this.bind("paste",function(){ 
 return false; 
 }); 
 this.bind("keyup",function(){ 
 if(/(^0+)/.test(this.value)) 
 { 
 this.value = this.value.replace(/^0*/,''); 
 } 
 }); 
}; 
$(function(){ 
 $("#txt").integer();
}); 
</script>
</head>
<body>
<input type="text" id="txt" />
</body>
</html>
Salin selepas log masuk
Kod di atas memenuhi keperluan kami Hanya integer boleh dimasukkan ke dalam kotak teks.

Saya harap artikel ini akan membantu semua orang yang mempelajari pengaturcaraan jquery.

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan