javascript常用功能汇总
1.javascript的数组API:
//定义数组
varpageIds=newArray();
pageIds.push('A');
数组长度
pageIds.length;
//shift:删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined
vara=[1,2,3,4,5];
varb=a.shift();//a:[2,3,4,5]b:1
//unshift:将参数添加到原数组开头,并返回数组的长度
vara=[1,2,3,4,5];
varb=a.unshift(-2,-1);//a:[-2,-1,1,2,3,4,5]b:7
//注:在IE6.0下测试返回值总为undefined,FF2.0下测试返回值为7,所以这个方法的返回值不可靠,需要用返回值时可用splice代替本方法来使用。
//pop:删除原数组最后一项,并返回删除元素的值;如果数组为空则返回undefined
vara=[1,2,3,4,5];
varb=a.pop();//a:[1,2,3,4]b:5
//push:将参数添加到原数组末尾,并返回数组的长度
vara=[1,2,3,4,5];
varb=a.push(6,7);//a:[1,2,3,4,5,6,7]b:7
//concat:返回一个新数组,是将参数添加到原数组中构成的
vara=[1,2,3,4,5];
varb=a.concat(6,7);//a:[1,2,3,4,5]b:[1,2,3,4,5,6,7]
//splice(start,deleteCount,val1,val2,):从start位置开始删除deleteCount项,并从该位置起插入val1,val2,
vara=[1,2,3,4,5];
varb=a.splice(2,2,7,8,9);//a:[1,2,7,8,9,5]b:[3,4]
varb=a.splice(0,1);//同shift
a.splice(0,0,-2,-1);varb=a.length;//同unshift
varb=a.splice(a.length-1,1);//同pop
a.splice(a.length,0,6,7);varb=a.length;//同push
//reverse:将数组反序
vara=[1,2,3,4,5];
varb=a.reverse();//a:[5,4,3,2,1]b:[5,4,3,2,1]
//sort(orderfunction):按指定的参数对数组进行排序
vara=[1,2,3,4,5];
varb=a.sort();//a:[1,2,3,4,5]b:[1,2,3,4,5]
//slice(start,end):返回从原数组中指定开始下标到结束下标之间的项组成的新数组
vara=[1,2,3,4,5];
varb=a.slice(2,5);//a:[1,2,3,4,5]b:[3,4,5]
//join(separator):将数组的元素组起一个字符串,以separator为分隔符,省略的话则用默认用逗号为分隔符
vara=[1,2,3,4,5];
varb=a.join("|");//a:[1,2,3,4,5]b:"1|2|3|4|5"
2.dom最常用API:
//document方法: getElementById(id)Node返回指定结点的引用 getElementsByTagName(name)NodeList返回文档中所有匹配的元素的集合 createElement(name)NodeNode createTextNode(text)Node创建一个纯文本结点 ownerDocumentDocument指向这个节点所属的文档 documentElementNode返回html节点 document.bodyNode返回body节点 //element方法: getAttribute(attributeName)String返回指定属性的值 setAttribute(attributeName,value)String给属性赋值 removeAttribute(attributeName)String移除指定属性和它的值 getElementsByTagName(name)NodeList返回结点内所有匹配的元素的集合 //node方法: appendChild(child)Node给指定结点添加一个新的子结点 removeChild(child)Node移除指定结点的子结点 replaceChild(newChild,oldChild)Node替换指定结点的子结点 insertBefore(newChild,refChild)Node在同一层级的结点前面插入新结点 hasChildNodes()Boolean如果结点有子结点则返回true //node属性: nodeNameString以字符串的格式存放结点的名称 nodeTypeString以整型数据格式存放结点的类型 nodeValueString以可用的格式存放结点的值 parentNodeNode指向结点的父结点的引用 childNodesNodeList指向子结点的引用的集合 firstChildNode指向子结点结合中的第一个子结点的引用 lastChildNode指向子结点结合中的最后一个子结点的引用 previousSiblingNode指向前一个兄弟节点;如果这个节点就是兄弟节点,那么该值为null nextSiblingNode指向后一个兄弟节点;如果这个节点就是兄弟节点,那么该值为null
3.网上搜藏的一个map对象:
functionHashMap()
{
/**Map大小**/
varsize=0;
/**对象**/
varentry=newObject();
/**存**/
this.put=function(key,value)
{
if(!this.containsKey(key))
{
size++;
}
entry[key]=value;
}
/**取**/
this.get=function(key)
{
returnthis.containsKey(key)?entry[key]:null;
}
/**删除**/
this.remove=function(key)
{
if(this.containsKey(key)&&(deleteentry[key]))
{
size--;
}
}
/**是否包含Key**/
this.containsKey=function(key)
{
return(keyinentry);
}
/**是否包含Value**/
this.containsValue=function(value)
{
for(varpropinentry)
{
if(entry[prop]==value)
{
returntrue;
}
}
returnfalse;
}
/**所有Value**/
this.values=function()
{
varvalues=newArray();
for(varpropinentry)
{
values.push(entry[prop]);
}
returnvalues;
}
/**所有Key**/
this.keys=function()
{
varkeys=newArray();
for(varpropinentry)
{
keys.push(prop);
}
returnkeys;
}
/**MapSize**/
this.size=function()
{
returnsize;
}
/*清空*/
this.clear=function()
{
size=0;
entry=newObject();
}
}
varmap=newHashMap();
/*
map.put("A","1");
map.put("B","2");
map.put("A","5");
map.put("C","3");
map.put("A","4");
*/
/*
alert(map.containsKey("XX"));
alert(map.size());
alert(map.get("A"));
alert(map.get("XX"));
map.remove("A");
alert(map.size());
alert(map.get("A"));
*/
/**同时也可以把对象作为Key**/
/*
vararrayKey=newArray("1","2","3","4");
vararrayValue=newArray("A","B","C","D");
map.put(arrayKey,arrayValue);
varvalue=map.get(arrayKey);
for(vari=0;i<value.length;i++)
{
//alert(value[i]);
}
*/
/**把对象做为Key时,自动调用了该对象的toString()方法其实最终还是以String对象为Key**/
/**如果是自定义对象那自己得重写toString()方法否则.就是下面的结果**/
functionMyObject(name)
{
this.name=name;
}
/**
functionMyObject(name)
{
this.name=name;
this.toString=function()
{
returnthis.name;
}
}
**/
varobject1=newMyObject("小张");
varobject2=newMyObject("小名");
map.put(object1,"小张");
map.put(object2,"小名");
alert(map.get(object1));
alert(map.get(object2));
map.remove("xxxxx");
alert(map.size());
/**运行结果小名小名size=1**/
/**如果改成复写toString()方法的对象,效果就完全不一样了**/
4.常用的数字函数:
//·数字型(Number)
//1.声明
vari=1;
vari=newNumber(1);
//2.字符串与数字间的转换
vari=1;
varstr=i.toString();//结果:"1"
varstr=newString(i);//结果:"1"
i=parseInt(str);//结果:1
i=parseFloat(str);//结果:1.0
//注意:parseInt,parseFloat会把一个类似于"32G"的字符串,强制转换成32
//3.判断是否为有效的数字
vari=123;varstr="string";
if(typeofi=="number"){}//true
//某些方法(如:parseInt,parseFloat)会返回一个特殊的值NaN(NotaNumber)
//请注意第2点中的[注意],此方法不完全适合判断一个字符串是否是数字型!!
i=parseInt(str);
if(isNaN(i)){}
//4.数字型比较
//此知识与[字符串比较]相同
///5.小数转整数
varf=1.5;
vari=Math.round(f);//结果:2(四舍五入)
vari=Math.ceil(f);//结果:2(返回大于f的最小整数)
vari=Math.floor(f);//结果:1(返回小于f的最大整数)
//6.格式化显示数字
vari=3.14159;
//格式化为两位小数的浮点数
varstr=i.toFixed(2);//结果:"3.14"
//格式化为五位数字的浮点数(从左到右五位数字,不够补零)
varstr=i.toPrecision(5);//结果:"3.1415"
//7.X进制数字的转换
//不是很懂-.-
vari=parseInt("0x1f",16);
vari=parseInt(i,10);
vari=parseInt("11010011",2);
//8.随机数
//返回0-1之间的任意小数
varrnd=Math.random();
//返回0-n之间的任意整数(不包括n)
varrnd=Math.floor(Math.random()*n)
5.网上搜藏的js堆栈:
functionstack(){
if(this.top==undefined){
//初始化堆栈的顶部指针和数据存放域
this.top=0;
this.unit=newArray();
}
this.push=function(pushvalue){
//定义压入堆栈的方法
this.unit[this.top]=pushvalue;
this.top+=1;
}
this.readAllElements=function(){
//定义读取所有数据的方法
if(this.top==0){
alert("当前栈空,无法读取数据");
return("");
}
varcount=0;
varoutStr="";
for(count=0;count<this.top;count++){
outStr+=this.unit[count]+",";
}
return(outStr);
}
this.pop=function(){
//定义弹出堆栈的方法
if(this.top==0){
alert("当前栈空,无法弹出数据");
return("");
}
varpopTo=this.unit[this.top-1];
this.top--;
return(popTo);
/*从堆栈弹出数据,顶部指针减一,不过这里没有做到资源的释放,也
就是说数据仍然存在于this.unit的数组中,只不过无法访问罢了。目前
我也没想到好的办法解决。*/
}
}
6.最常用的JavaScript日期函数:
//·日期型(Date)
//1.声明
varmyDate=newDate();//系统当前时间
varmyDate=newDate(yyyy,mm,dd,hh,mm,ss);
varmyDate=newDate(yyyy,mm,dd);
varmyDate=newDate("monthNamedd,yyyyhh:mm:ss");
varmyDate=newDate("monthNamedd,yyyy");
varmyDate=newDate(epochMilliseconds);
//2.获取时间的某部份
varmyDate=newDate();
myDate.getYear();//获取当前年份(2位)
myDate.getFullYear();//获取完整的年份(4位,1970-????)
myDate.getMonth();//获取当前月份(0-11,0代表1月)
myDate.getDate();//获取当前日(1-31)
myDate.getDay();//获取当前星期X(0-6,0代表星期天)
myDate.getTime();//获取当前时间(从1970.1.1开始的毫秒数)时间戳!!
myDate.getHours();//获取当前小时数(0-23)
myDate.getMinutes();//获取当前分钟数(0-59)
myDate.getSeconds();//获取当前秒数(0-59)
myDate.getMilliseconds();//获取当前毫秒数(0-999)
myDate.toLocaleDateString();//获取当前日期
myDate.toLocaleTimeString();//获取当前时间
myDate.toLocaleString();//获取日期与时间
//3.计算之前或未来的时间
varmyDate=newDate();
myDate.setDate(myDate.getDate()+10);//当前时间加10天
//类似的方法都基本相同,以set开头,具体参考第2点
//4.计算两个日期的偏移量
vari=daysBetween(beginDate,endDate);//返回天数
vari=beginDate.getTimezoneOffset(endDate);//返回分钟数
//5.检查有效日期
//checkDate()只允许"mm-dd-yyyy"或"mm/dd/yyyy"两种格式的日期
if(checkDate("2006-01-01")){}
//正则表达式(自己写的检查yyyy-mm-dd,yy-mm-dd,yyyy/mm/dd,yy/mm/dd四种)
varr=/^(\d{2}|\d{4})[\/-]\d{1,2}[\/-]\d{1,2}$/;
if(r.test(myString)){}
7.最常用字符串函数API:
//·字符串(String)
//1.声明
varmyString=newString("Everygoodboydoesfine.");
varmyString="Everygoodboydoesfine.";
//2.字符串连接
varmyString="Every"+"goodboy"+"doesfine.";
varmyString="Every";myString+="goodboydoesfine.";
//3.截取字符串
//截取第6位开始的字符
varmyString="Everygoodboydoesfine.";
varsection=myString.substring(6);//结果:"goodboydoesfine."
//截取第0位开始至第10位为止的字符
varmyString="Everygoodboydoesfine.";
varsection=myString.substring(0,10);//结果:"Everygood"
//截取从第11位到倒数第6位为止的字符
varmyString="Everygoodboydoesfine.";
varsection=myString.slice(11,-6);//结果:"boydoes"
//从第6位开始截取长度为4的字符
varmyString="Everygoodboydoesfine.";
varsection=myString.substr(6,4);//结果:"good"
//4.转换大小写
varmyString="Hello";
varlcString=myString.toLowerCase();//结果:"hello"
varucString=myString.toUpperCase();//结果:"HELLO"
//5.字符串比较
varaString="Hello!";
varbString=newString("Hello!");
if(aString=="Hello!"){}//结果:true
if(aString==bString){}//结果:true
if(aString===bString){}//结果:false(两个对象不同,尽管它们的值相同)
//6.检索字符串
varmyString="helloeverybody.";
//如果检索不到会返回-1,检索到的话返回在该串中的起始位置
if(myString.indexOf("every")>-1){}//结果:true
////7.查找替换字符串
varmyString="Iisyourfather.";
varresult=myString.replace("is","am");//结果:"Iamyourfather."
//8.特殊字符:
//\b:后退符\t:水平制表符
//\n:换行符\v:垂直制表符
//\f:分页符\r:回车符
//\":双引号\':单引号
//\\:反斜杆
//9.将字符转换成Unicode编码
varmyString="hello";
varcode=myString.charCodeAt(3);//返回"l"的Unicode编码(整型)
varchar=String.fromCharCode(66);//返回Unicode为66的字符
//10.将字符串转换成URL编码
varmyString="helloall";
varcode=encodeURI(myString);//结果:"hello%20all"
varstr=decodeURI(code);//结果:"helloall"
//相应的还有:encodeURIComponent()decodeURIComponent()
8.数学函数:
·Math对象 1.Math.abs(num):返回num的绝对值 2.Math.acos(num):返回num的反余弦值 3.Math.asin(num):返回num的反正弦值 4.Math.atan(num):返回num的反正切值 5.Math.atan2(y,x):返回y除以x的商的反正切值 6.Math.ceil(num):返回大于num的最小整数 7.Math.cos(num):返回num的余弦值 8.Math.exp(x):返回以自然数为底,x次幂的数 9.Math.floor(num):返回小于num的最大整数 10.Math.log(num):返回num的自然对数 11.Math.max(num1,num2):返回num1和num2中较大的一个 12.Math.min(num1,num2):返回num1和num2中较小的一个 13.Math.pow(x,y):返回x的y次方的值 14.Math.random():返回0到1之间的一个随机数 15.Math.round(num):返回num四舍五入后的值 16.Math.sin(num):返回num的正弦值 17.Math.sqrt(num):返回num的平方根 18.Math.tan(num):返回num的正切值 19.Math.E:自然数(2.718281828459045) 20.Math.LN2:2的自然对数(0.6931471805599453) 21.Math.LN10:10的自然对数(2.302585092994046) 22.Math.LOG2E:log2为底的自然数(1.4426950408889634) 23.Math.LOG10E:log10为底的自然数(0.4342944819032518) 24.Math.PI:π(3.141592653589793) 25.Math.SQRT1_2:1/2的平方根(0.7071067811865476) 26.Math.SQRT2:2的平方根(1.4142135623730951)
9.浏览器特征函数:
//1.浏览器名称
//IE:"MicrosoftInternetExplorer"
//NS:"Netscape"
varbrowserName=navigator.appName;
//2.浏览器版本
varbrowserVersion=navigator.appVersion;
//3.客户端操作系统
varisWin=(navigator.userAgent.indexOf("Win")!=-1);
varisMac=(navigator.userAgent.indexOf("Mac")!=-1);
varisUnix=(navigator.userAgent.indexOf("X11")!=-1);
//4.判断是否支持某对象,方法,属性
//当一个对象,方法,属性未定义时会返回undefined或null等,这些特殊值都是false
if(document.images){}
if(document.getElementById){}
//5.检查浏览器当前语言
if(navigator.userLanguage){varl=navigator.userLanguage.toUpperCase();}
//6.检查浏览器是否支持Cookies
if(navigator.cookieEnabled){}
10.JavaScript面向对象的方法实现继承:call方法
//动物类animal
functionanimal(bSex){
this.sex=bSex
this.getSex=function(){
returnthis.sex
}
}
//类静态变量(如果你不修改它的话~~)
animal.SEX_G=newObject();//雌性
animal.SEX_B=newObject();//雄性
//动物子类鸟
functionbird(bSex){
animal.call(this,bSex);
this.fly=function(iSpeed){
alert("飞行时速高达"+iSpeed);
}
}
//动物子类鱼
functionfish(bSex){
animal.call(this,bSex);
this.swim=function(iSpeed){
alert("游动时速高达"+iSpeed)
}
}
//鱼鸟杂交品种。。。
functioncrossBF(bSex){
bird.call(this,bSex);
fish.call(this,bSex);
}
varoPet=newcrossBF(animal.SEX_G);//雌性鱼鸟
alert(oPet.getSex()==animal.SEX_G?"雌性":"雄性");
oPet.fly(124)
oPet.swim(254)
11.用面向对象的编程方式写JavaScript:
MyTool=newfunction(){
/**
*返回非空字符串,如果有默认值就返回默认字符串.
*/
this.notNull=function(str,defaultStr){
if(typeof(str)=="undefined"||str==null||str==''){
if(defaultStr)
returndefaultStr;
else
return'';
}
else{
returnstr;
}
}
}
rootId=MyTool.notNull(rootId,'001000');
12.常用的js方法,包括表单校验的一些方法,下拉菜单常用的方法等等:
/**
*对JSON对象转换为字符串.
*@param{json对象}json
*@return{json字符串}
*/
functionjsonObj2Str(json){
varstr="{";
for(propinjson){
str+=prop+":"+json[prop]+",";
}
str=str.substr(0,str.length-1);
str+="}";
returnstr;
}
/**
*将json字符串转换为json对象.
*@param{json字符串}jsonstr
*@return{json对象}
*/
functionjsonStr2Obj(jsonstr){
returneval("("+jsonstr+")");
}
/**
*得到一个元素的left坐标值.
*@param{dom对象}obj
*@return{位置值}
*/
functiongetLeft(obj){
varoffset=e.offsetLeft;
if(e.offsetParent!=null)offset+=getLeft(e.offsetParent);
returnoffset;
}
/**
*得到一个元素的绝对位置的top坐标值.
*@param{dom对象}obj
*@return{位置值}
*/
functiongetTop(obj){
varoffset=e.offsetTop;
if(e.offsetParent!=null)offset+=getTop(e.offsetParent);
returnoffset;
}
/**
*删除一个字符串的左右空格.
*@param{原始字符串}str
*@return{删除空格之后的字符串}
*/
functiontrim(str)
{
returnstr.replace(/(^\s*)|(\s*$)/g,"");
}
/**
*根据id取出一个元素.
*@param{元素id值}str
*@return{dom对象}
*/
function$(str){
returndocument.getElementById(str);
}
/**
*按name获取一个对象.
*@param{元素name值}str
*@return{根据name返回的第一个对象}
*/
function$byName(str){
vararr=document.getElementsByName(str);
if(arr)
returnarr[0];
else
returnnull;
}
/***************以下方法和表单验证相关*************************************************/
/**
*返回非空字符串,如果有默认值就返回默认字符串.
*@param{要进行转换的原字符串}str
*@param{默认值}defaultStr
*@return{返回结果}
*/
functionnotNull(str,defaultStr){
if(typeof(str)=="undefined"||str==null||str==''){
if(defaultStr)
returndefaultStr;
else
return'';
}else{
returnstr;
}
}
/**
*比较两个日期大小.
*@param{较小日期的文本框id}smallDate
*@param{较大日期的文本框id}bigDate
*@param{出错的提示信息}msg
*/
functioncompareTwoDate(smallDate,bigDate,msg){
varv1=$(smallDate).value;
varv2=$(bigDate).value;
if(v1>=v2){
alert(msg);
v2.focus();
returnfalse;
}
returntrue;
}
/**
*比较两个金额大小的方法.
*@param{较小的金额}smallNum
*@param{较大的金额}bigNum
*@param{出错提示信息}msg
*@return{Boolean}
*/
functioncompareTwoNum(smallNum,bigNum,msg){
varv1=$(smallNum).value;
varv2=$(bigNum).value;
if(parseFloat(v1)>=parseFloat(v2)){
alert(msg);
v2.focus();
returnfalse;
}
returntrue;
}
/**
*检查文本框的长度是否超出指定长度.
*@param{文本id}textId
*@param{文本框的最大长度}len
*@param{文本框描述内容}msg
*@return{有错就返回false,否则返回true}
*/
functioncheckLength(textId,len,msg){
obj=$(textId);
str=obj.value;
str=str.replace(/[^\x00-\xff]/g,"**");
realLen=str.length;
if(realLen>len){
alert("["+msg+"]"+"长度最大为"+len+"位,"+"请重新输入!\n注意:一个汉字占2位。");
obj.focus();
returnfalse;
}else
returntrue;
}
/**
*判断某个文本框不可以为空.
*@param{文本框id}textId
*@param{文本框描述内容}msg
*@return{有错就返回false,否则返回true}
*/
functioncheckIfEmpty(textId,msg){
vartextObj=$(textId);
vartextValue=textObj.value;
if(trim(textValue)==''){
alert('['+msg+']不得为空!');
textObj.focus();
returnfalse;
}else{
returntrue;
}
}
/**
*判断指定文本框内容必须为邮件.
*@param{文本框id}textId
*@param{文本框描述}msg
*@return{如果是邮件内容就返回true否则返回false}
*/
functioncheckIsMail(textId,msg){
varobj=$(textId);
if(!_isEmail(obj.value)){
alert('['+msg+']不是合法的邮件地址!');
obj.focus();
returnfalse;
}else
returntrue;
}
/**
*验证是不是邮件.
*@param{要验证的字符串}strEmail
*@return{Boolean}
*/
function_isEmail(strEmail){
//接下来的验证是否有两个以上的‘.'号,有的话就是错的!
varfirst=strEmail.indexOf('.');
if(strEmail.indexOf('@')==-1){
returnfalse;
}
vartempStr=strEmail.substring(first+1);
if(tempStr.indexOf('.')!=-1){
returnfalse;
}
if(strEmail
.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/)!=-1){
returntrue;
}else
returnfalse;
}
/**
*判断某个文本框是否数字.
*@param{文本框id}textId
*@param{文本框描述内容}msg
*@return{Boolean}
*/
functioncheckIsNum(textId,msg){
obj=$(textId);
if(isNaN(obj.value)){
alert('['+msg+']必须为数字。');
obj.focus();
returnfalse;
}else
returntrue;
}
/**
*判断某个文本框是否含有非法字符.
*@param{文本框的id}textId
*@param{文本框描述内容}msg
*@return{有错就返回false否则返回true}
*/
functioncheckIsValid(textId,msg){
obj=$(textId);
if(!_isValidString(obj.value,'['+msg+']不得含有非法字符。')){
obj.focus();
returnfalse;
}
returntrue;
}
/**
*判断是不是合法字符串.
*@param{要进行判断的字符串}szStr
*@param{文本描述}errMsg
*@return{合法则返回true否则返回false}
*/
function_isValidString(szStr,errMsg){
voidChar="'\"><`~!@#$%^&\(\)()!¥……??“”‘'*";
for(vari=0;i<voidChar.length;i++){
aChar=voidChar.substring(i,i+1);
if(szStr.indexOf(aChar)>-1){
alert(errMsg)
returnfalse;
}
}
returntrue;
}
/***************以下方法和下拉菜单相关*************************************************/
/**
*控制下拉菜单不可以为-1(未选择情况value=-1)
*@param{下拉菜单id}selectId
*@param{下拉菜单描述内容}msg
*@param{下拉菜单的空值对应的value,默认为-1}nullValue
*@return{Boolean}
*/
functioncheckChooseSelect(selectId,msg,nullValue){
varobj=$(selectId);
if(obj.value==notNull(nullValue,'-1')){
alert('['+msg+']必选!');
obj.focus();
returnfalse;
}else
returntrue;
}
/**
*得到下拉菜单的显示的文字.
*@param{下拉菜单dom对象}selectObj
*@return{返回下拉菜单的显示的"文本"}
*/
functiongetSelectText(selectObj){
returnselectObj.options[selectObj.selectedIndex].text;
}
/**
*得到下拉菜单的显示的值.
*@param{下拉菜单dom对象}selectObj
*@return{得到下拉菜单的显示的"值"}
*/
functiongetSelectValue(selectObj){
returnselectObj.options[selectObj.selectedIndex].value;
}
/**
*设置下拉菜单的选择状态到指定的值.
*@param{下拉菜单对象}obj
*@param{要选择的值}value
*/
functionsetSelectValue(obj,value){
/*for(i=obj.options.length-1;i>=0;i--){
if(obj.options[i].value==value){
obj.options[i].selected=true;
return;
}
}
*/
obj.value=value;
}
/**
*根据键值串的内容进行下拉菜单的动态组装
*@param{要进行下拉菜单组装的dom对象}obj
*@param{键值对用,和;分割,例如'1,男;2,女;3,未知'}valAndText
*/
functionsetSelectContent(obj,valAndText){
if(trim(valAndText)==''){
alert('没有要进行组装下拉菜单的数据!');
returnfalse;
}
clearSelect(obj);
varkeyandvalues=valAndText.split(';');
for(vari=0;i<keyandvalues.length;i++){
vararr=keyandvalues[i].split(',');
if(arr){
varvalue=arr[0];
vartext=arr[1];
varobjOption=newOption(text,value);
obj.add(objOption);
}
}
}
/**
*清空下拉菜单里面的内容.
*@param{下拉菜单对象}obj
*/
functionclearSelect(obj){
for(vari=obj.options.length;i>0;i--){
obj.remove(0);
}
}
/***************以下方法和多选框相关*************************************************/
/**
*返回选中的checks的id组成的字符串,逗号隔开.
*@param{checks数组}checks
*@return选择的id组成的字符串
*/
functiongetCheckedIds(checks){
varselectedValue='';
varlen=checks.length;
for(varindex=0;index<len;index++){
if(checks[index].checked==true){
selectedValue+=checks[index].value+",";
}
}
if(selectedValue.length>0)
returnselectedValue.substring(0,selectedValue.length-1);
returnselectedValue;
}
下面的代码放到html标签里,并在head里调用上面的js:
<HEAD>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<!--<<<<<<<<<<<调用上面的js>>>>>>>>>-->
</HEAD>
<SCRIPTLANGUAGE="JavaScript">
<!--
/**
*表单验证的示例js方法.
*/
functioncheck(){
if(checkIfEmpty('a','非空校验')
&&checkIsMail('b','邮箱校验')
&&checkIsNum('c','数字校验')
&&checkIsValid('d','合法性校验')
&&compareTwoDate('e','f','小日期与大日期关系错误!')
&&checkLength('g',5,'长度校验')
&&checkChooseSelect('h','下拉菜单非空','-1')
&&compareTwoNum('k','l','大小数目关系不正确!')){
alert('校验通过!');
returntrue;
}else{
returnfalse;
}
}
/**
*取下拉菜单的值和文本的示例js方法.
*/
functiongetSelect(){
varsss=$('h');
alert('下拉菜单选择的文本是:'+getSelectText(sss)+'\n'
+'下拉菜单选择的值是:'+getSelectValue(sss));
}
/**
*根据键值字符串设置下拉菜单的显示内容.
*/
functionsetSelect(){
varsss=$('i').value;
setSelectContent($('h'),sss);
}
/**
*返回多选框数组选择状态的id的字符串,结果以逗号隔开.
*/
functiongetMulti(){
alert('多选选择的id是:'+getCheckedIds(document.getElementsByName('j')));
}
//-->
</SCRIPT>
<BODY>
<table>
<tr>
<td>非空:
<inputid='a'></td>
<td>checkIfEmpty('a','非空校验')</td>
</tr>
<tr>
<td>邮箱:
<inputid='b'value='323232@2323.com'></td>
<td>checkIsMail('b','邮箱校验')</td>
</tr>
<tr>
<td>数字:
<inputid='c'value='aaaa'></td>
<td>checkIsNum('c','数字校验')</td>
</tr>
<tr>
<td>合法字符:
<inputid='d'value='@$@$#$#!%%#'></td>
<td>checkIsValid('d','合法性校验')</td>
</tr>
<tr>
<td>小的日期:
<inputid='e'value='2010-1-1'>
大的日期:
<inputid='f'value='2011-1-1'></td>
<td>compareTwoDate('e','f','小日期与大日期关系错误!')</td>
</tr>
<tr>
<td>小的数:
<inputid='k'value='12.3'>
大的数:
<inputid='l'value='4564'></td>
<td>compareTwoNum('k','l','大小数目关系不正确!')</td>
</tr>
<tr>
<td>字符长度校验(<5):
<inputid='g'></td>
<td>checkLength('g',5,'长度校验')</td>
</tr>
<tr>
<td>下拉菜单非空校验:
<selectid='h'>
<optionvalue='-1'>请选择</option>
<optionvalue='1'>立项</option>
<optionvalue='2'>可研</option>
</select></td>
<td>checkChooseSelect('h','下拉菜单非空','-1')</td>
</tr>
<tr>
<tdcolspan='2'><buttononclick='check()'>测试表单校验方法</button></td>
</tr>
<tr>
<td><buttononclick='getSelect()'>得到下拉菜单的值</button></td>
<td>getSelectText(sss)和getSelectValue(sss)</td>
</tr>
<tr>
<td>输入下拉菜单的键值字符串(如右所示)
<inputid='i'value='1,男;2,女;3,未知'>
<buttononclick='setSelect()'>设置下拉菜单的值</button></td>
<td>setSelectContent($('h'),sss)</td>
</tr>
<tr>
<td><inputtype='checkbox'name='j'value='aaa1'>
<inputtype='checkbox'name='j'value='aaa2'>
<inputtype='checkbox'name='j'value='aaa3'>
<inputtype='checkbox'name='j'value='aaa4'>
<buttononclick='getMulti()'>得到多选选择的id</button></td>
<td>getCheckedIds(document.getElementsByName('j'))</td>
</tr>
</table>
</BODY>
以上所述就是本文的全部内容了,希望大家能够喜欢。