Loading data........
Tin nhanh :
Xem Tivi Online

Tổng hợp các kênh giải trí (Đang cập nhật chức năng..)

New Update

Truyền hình SCTV

SCTV14

SCTV15

SCTV16

SCTV17

SCTV18 HD

Vietnam Channels

VTV1

VTV2

VTV3

VTV4

VTV6

VTV9

VTC Online

VTC1

VTC2

VTC3

VTC4

VTC5

VTC6

VTC Online

VTC7

VTC8

VTC9

VTC10

VTC11

VTC12

Truyền hình tp HCM

HTV1

HTV2

HTV3

HTV4

HTV7

HTV9

Radio Channels

VOV1

VOV2

VOV3

VOV4

VOV5

VOV GT-HN

Home » » Code Script chỉ cho phép nhập số nguyên vào Textbox

Code Script chỉ cho phép nhập số nguyên vào Textbox

Đoạn mã javascipt này chỉ cho phép nhập các số nguyên/ số thực vào textbox (không có khoảng trắng).....
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
function valid(o,w){
o.value = o.value.replace(valid.r[w],'');
}
valid.r={
'numbers':/[^\d]/g
}
</script>
</head>
<body>
<form id="myform" method="" action="">
This field will only accept integer numbers:
<br>
<input type="text" name="txtPostal" onkeyup="valid(this,'numbers')" onblur="valid(this,'numbers')">
</form>
</body>
</html>
Còn đoạn mã dưới cho phép nhập cả dấu phẩy vào textbox
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
<script>
var date_seperator = '-';
var decimal_seperator = ',';
var thousand_seperator = '.';
 var K_Validate = {
  Version: '1.0.0',
  Load: function(){
   var children = document.getElementsByTagName('input');
   for (var i = 0; i < children.length; i  ) {
    var classNames = children[i].className.split(' ');
     
     if (children[i].className.match(new RegExp("(^|\\s,)validatenum(\\s|$)"))) {
      this.addInListener(children[i],'keypress',K_Validate.checkNum);
      
      if (children[i].className.match(new RegExp("(^|\\s)thousand(\\s|$)"))) {
       this.addInListener(children[i],'focus',K_Validate.normalFormat);
       this.addInListener(children[i],'blur',K_Validate.formatThousand);
      }
     
     }
     if (children[i].className.match(new RegExp("(^|\\s,)validatedate(\\s|$)"))) {
       this.addInListener(children[i],'keypress',K_Validate.checkDate);
       this.addInListener(children[i],'blur',K_Validate.isDate);
       children[i].maxlength=10;
      }     
  
   }
  },
  addInListener : function (a,b,c){
   a["on" b]=c
  },
  
  isNumeric: function(ch) {
   if (!(ch >= '0' && ch <= '9')) {
    return false;
   }
  return true;
  },
  
  elo : function (e){
   if (!e) var e = window.event;
   var eid = (window.event) ? e.srcElement : e.target;
   if(!eid) return false;
   return eid;
  },
 
  checkNum: function (e,not_dec,not_minus) {
   if(!e) e = window.event;
   if(window.event){
    keynum = e.keyCode
   }else if(e.which){
    keynum = e.which
   } 
   if (K_Validate.elo(e).className.match(new RegExp("(^|\\s)nominus(\\s|$)"))) not_minus = true;
   if (K_Validate.elo(e).className.match(new RegExp("(^|\\s)nodecimal(\\s|$)"))) not_dec = true;
   if (!not_minus) not_minus = false;
   if (!not_dec) not_dec = false;
   var obj = (window.event) ? e.srcElement: e.target;

   var keychar;
   if (keynum == null) return true;
   goods = '0123456789';
   decimal_used = (obj.value.indexOf(decimal_seperator) != -1) ? true:false;
   minus_used = (obj.value.indexOf('-') != -1) ? true:false;

   if(!not_dec && !decimal_used) goods = goods decimal_seperator;
   keychar = String.fromCharCode(keynum);
   keychar = keychar.toLowerCase();
   goods = goods.toLowerCase();
   var curr_pos = K_Validate.insertAtCursor(obj);
   if(!not_minus && curr_pos<1 && !minus_used) goods = goods '-';

   if (goods.indexOf(keychar) != -1)
    return true;

   if ( keynum==null || keynum==0 || keynum==8 || keynum==9 || keynum==13 || keynum==27 )
    return true;

   return false;
  },
  
  insertAtCursor : function (obj) {
   if (document.selection) {
   sel=document.selection;
    if(sel)
    {
     r2=sel.createRange();
     rng=obj.createTextRange();
     rng.setEndPoint("EndToStart", r2);
     i=rng.text.length;
    }
    return i;
   }else if (obj.selectionStart || obj.selectionStart == '0') {
    return obj.selectionStart;
   }
  },
  
  
  
  formatThousand : function (e) {
   if(!e) e = window.event;
   obj = K_Validate.elo(e);
   formattedNbr="";
   if (obj.value.match(new RegExp(/-/))){
    var minus=true;
    obj.value = obj.value.replace("-","");
   }
   var temp_val = obj.value.split(decimal_seperator);
   len = temp_val[0].length;
   for (i=len-1, k=1 ; i>=0; i = i-1,k   )  {
    if (((k % 3) == 0) && (k != len))
     formattedNbr = thousand_seperator   temp_val[0].charAt(i)   formattedNbr;
    else
     formattedNbr = temp_val[0].charAt(i)   formattedNbr;
   }
   formattedNbr = (minus)?'-' formattedNbr:formattedNbr;
   if(temp_val[1]){
    obj.value = formattedNbr decimal_seperator temp_val[1];
   }else{
    obj.value = formattedNbr;
   }
  },

  normalFormat : function(e) {
   if(!e) e = window.event;
   obj = K_Validate.elo(e);
   tempText= new String();
   text = obj.value;
   if (text=="") { 
    return false;
   }
   len = text.length;
   for(i=0; i < len;   i) {
    ch = text.charAt(i);
    if ((ch >= '0' && ch <= '9') || ch==decimal_seperator || ch=='-') {
     tempText =ch;
    }
   }
   obj.value=tempText;
   return true;
  },
  
  checkDate : function (e){
   if(!e) e = window.event;
   var obj = (window.event) ? e.srcElement: e.target;
   if(window.event) // IE
   {
    keynum = e.keyCode
   }else if(e.which) {
    keynum = e.which
   }
   goods = '0123456789';
   keychar = String.fromCharCode(keynum);
   keychar = keychar.toLowerCase();
   var curr_pos = K_Validate.insertAtCursor(obj);
   if (goods.indexOf(keychar) != -1){
    if(curr_pos==2 && obj.value.charAt(2)!=date_seperator && obj.value.length<3){
     obj.value = obj.value date_seperator;
     curr_pos  ;
    }
    if(curr_pos==5 && obj.value.charAt(4)!=date_seperator && obj.value.length<6){
     obj.value = obj.value date_seperator;
     curr_pos  ;
    }
   return true;

   }
   if(keychar==date_seperator && (curr_pos==5 || curr_pos==2))
    return true;

   if ( keynum==null || keynum==0 || keynum==8 || keynum==9 || keynum==13 || keynum==27 )
    return true;

   return false;
  },
  
  getDateFromFormat : function (val,format){
   val=val "";
   format=format "";
   var i_val=0;
   var i_format=0;
   var c="";
   var token="";
   var token2="";
   var x,y;
   var now=new Date();
   var year=now.getYear();
   var month=now.getMonth() 1;
   var date=1;
   var hh=now.getHours();
   var mm=now.getMinutes();
   var ss=now.getSeconds();
   var ampm="";
   while(i_format < format.length){
    c=format.charAt(i_format);
    token="";
    while((format.charAt(i_format)==c) &&(i_format < format.length)){
     token  = format.charAt(i_format  );
    }
    if(token=="yyyy" || token=="yy" || token=="y"){
     if(token=="yyyy"){x=4;y=4;}
     if(token=="yy"){x=2;y=2;}
     if(token=="y"){x=2;y=4;}
     year=K_Validate._getInt(val,i_val,x,y);
     if(year==null){return 0;}
     i_val  = year.length;
     if(year.length==2){
      if(year > 70){
       year=1900 (year-0);
      }else{
       year=2000 (year-0);
      }
     }
    }else if(token=="MMM"||token=="NNN"){
     month=0;
     for(var i=0;i<MONTH_NAMES.length;i  ){
      var month_name=MONTH_NAMES[i];
      if(val.substring(i_val,i_val month_name.length).toLowerCase()==month_name.toLowerCase()){
       if(token=="MMM"||(token=="NNN"&&i>11)){
        month=i 1;
        if(month>12){month -= 12;}
        i_val  = month_name.length;
        break;
       }
      }
     }
    
     if((month < 1)||(month>12)){return 0;}
    }else if(token=="EE"||token=="E"){
     for(var i=0;i<DAY_NAMES.length;i  ){
      var day_name=DAY_NAMES[i];
      if(val.substring(i_val,i_val day_name.length).toLowerCase()==day_name.toLowerCase()){
       i_val  = day_name.length;
       break;
      }
     }
    }else if(token=="MM"||token=="M"){
     month=K_Validate._getInt(val,i_val,token.length,2);
     if(month==null||(month<1)||(month>12)){return 0;}
     i_val =month.length;
    }else if(token=="dd"||token=="d"){
     date=K_Validate._getInt(val,i_val,token.length,2);
     if(date==null||(date<1)||(date>31)){return 0;}
     i_val =date.length;
    }else if(token=="hh"||token=="h"){
     hh=K_Validate._getInt(val,i_val,token.length,2);
     if(hh==null||(hh<1)||(hh>12)){return 0;}
     i_val =hh.length;
    }else if(token=="HH"||token=="H"){
     hh=K_Validate._getInt(val,i_val,token.length,2);
     if(hh==null||(hh<0)||(hh>23)){return 0;}
     i_val =hh.length;
    }else if(token=="KK"||token=="K"){
     hh=K_Validate._getInt(val,i_val,token.length,2);
     if(hh==null||(hh<0)||(hh>11)){return 0;}
     i_val =hh.length;
    }else if(token=="kk"||token=="k"){
     hh=K_Validate._getInt(val,i_val,token.length,2);
     if(hh==null||(hh<1)||(hh>24)){return 0;}
     i_val =hh.length;hh--;
    }else if(token=="mm"||token=="m"){
     mm=K_Validate._getInt(val,i_val,token.length,2);
     if(mm==null||(mm<0)||(mm>59)){return 0;}
     i_val =mm.length;
    }else if(token=="ss"||token=="s"){
     ss=K_Validate._getInt(val,i_val,token.length,2);
     if(ss==null||(ss<0)||(ss>59)){return 0;}
     i_val =ss.length;
    }else if(token=="a"){
     if(val.substring(i_val,i_val 2).toLowerCase()=="am"){
      ampm="AM";
     }else if(val.substring(i_val,i_val 2).toLowerCase()=="pm"){
      ampm="PM";
     }else{return 0;}
     i_val =2;
    }else{
     if(val.substring(i_val,i_val token.length)!=token){
      return 0;
     }else{
      i_val =token.length;
     }
    }
   }
   if(i_val != val.length){return 0;}
   if(month==2){
    if( ((year%4==0)&&(year%100 != 0) ) ||(year%400==0) ){
     if(date > 29){return 0;}
    }else{
     if(date > 28){return 0;}
    }
   }
   if((month==4)||(month==6)||(month==9)||(month==11)){
    if(date > 30){return 0;}
   }
   if(hh<12 && ampm=="PM"){
    hh=hh-0 12;
   }else if(hh>11 && ampm=="AM"){
    hh-=12;
   }
   var newdate=new Date(year,month-1,date,hh,mm,ss);
   return newdate.getTime();
  },
  
  
 isDate : function (e){
  if(!e) e = window.event;
  obj = K_Validate.elo(e);
  var val = obj.value;
  var date=K_Validate.getDateFromFormat(val,"dd-MM-y");
  if(date==0){
   obj.style.color="#ff0000";
  }else{
   obj.style.color="#000000";
  }
 },
 
 
 _isInteger : function (val){
  var digits="1234567890";
  for(var i=0;i < val.length;i  ){if(digits.indexOf(val.charAt(i))==-1){return false;}}return true;
 },



 _getInt : function (str,i,minlength,maxlength){
 for(var x=maxlength;x>=minlength;x--){
  var token=str.substring(i,i x);
   if(token.length < minlength){
    return null;
    }
   if(K_Validate._isInteger(token)){
    return token;
    }
  }
 return null;
 }


 }
</script>
<style type="text/css">
body {
  font-family: arial, sans-serif, helvetica;
  padding: 0px;
  margin: 0px;
  background-color: white;
  color: black;
}
.top {
 background: #FFFFCC;
 padding: 3px 10px;
 font-size: 14px;
   margin: 0px;

}

input {
 font-size: 16px;
 font-weight: bold;
}
.input_container {
 padding: 5px 30px;
}
pre {
 padding: 5px;
 border: 1px #660033 dashed;
 background:#FFFFDD;
}
.tool {
 font-size: 10px; color: #666;
}
.style1 {
 font-family: "Courier New", Courier, monospace;
 background:#FFFFDD;
 font-size: 12px;
}
.style2 {
 color: #800080;
}
.style3 {
 color: #008000;
}
</style>
</head>

<body>

<h1>Number &amp; Date Validation with JavaScript Examples </h1>
<h4>Auto validating with &quot;<code>class</code>&quot; attribute</h4>
This class uses 
<code>class</code> attributes to make fields able validate. <br>
Use
<span class="style1">validatenum</span> to make validation if field is number 
with
<span class="style1">validatenum</span>&nbsp; you can use also
<span class="style1">nominus</span> to block negative numbers (&quot;-&quot; sign),
<span class="style1">nodecimal</span> to block decimal numbers and
<span class="style1">thousand</span> to put thousand separators after <span class="style1">blur</span> 
action. <br>
You can use also <span class="style1">validatedate</span> className to validate dates.<br>
<br>
You should replace variables:<br>
<br>
<pre>
<span class="style2"><strong>var</strong></span> date_seperator = <span class="style3">'-'</span>;
<span class="style2"><strong>var</strong></span> decimal_seperator = <span class="style3">','</span>;
<span class="style2"><strong>var</strong></span> thousand_seperator = <span class="style3">'.'</span>;
</pre>
<div class="input_container">
<pre> class="validatenum nominus thousand nodecimal" </pre>
<input type="text" class="validatenum nominus thousand nodecimal" style="width: 254px"/><span class="tool">(Type 
Something to test)</span>
<pre> class="validatenum nominus thousand" </pre>
<input type="text" class="validatenum nominus thousand" style="width: 254px"/><span class="tool">(Type 
Something to test)</span>
<pre> class="validatenum thousand" </pre>
<input type="text" class="validatenum thousand" style="width: 254px"/><span class="tool">(Type 
Something to test)</span>
<pre> class="validatenum" </pre>
<input type="text" class="validatenum" style="width: 254px"/><span class="tool">(Type 
Something to test)</span>

<pre> class="validatedate" </pre>
<input type="text" class="validatedate"  style="width: 254px"/><span class="tool">(Type 
Something to test)</span>

</div>
<hr />
<h4>Manual</h4>
<div class="input_container">
<pre>onkeypress="return K_Validate.checkNum(event)" </pre>
<input type="text" onKeyPress="return K_Validate.checkNum(event)" style="width: 254px"/><span class="tool">(Type 
Something to test)</span></div>
<hr />
</body>
<script>
K_Validate.Load();
</script>
</html>

Like và chia sẻ với bạn bè :

1 comment:

  1. Cảm ơn bạn!, mời bạn ghé thăm blog của mình nhé, blog nói về các loài vật gần gũi với con người, đăc biệt là chú cún nhỏ : dogs

    ReplyDelete

Bạn có ý kiến thắc mắc hay bình luận gì về bài viết này vui lòng để lại lời nhắn.Cám ơn bạn đã ghé thăm !

 
Proudly powered by Blogger
Copyright © 2009-. The Color Of Life - All Rights Reserved