标签归档:Javascript

Javascript 电话匹配脚本

最近朋友让帮忙写个电话匹配脚本。能支持的电话有手机号,电话号码。手机号、电话区号前面均可带零。

<pre><script type="text/javascript">
var $ = {
'blue':'<span style=color:#090>[OK]</span>',
'red':'<span style=color:#FAA>Bad.</span>'
}
var ttt = Array(
'+86.053912345678',
'015854999261',
'15854999261',
'158549992161',
'+86.5391234567'
);
for(i=0;i<ttt.length;i++){
  document.writeln(ttt[i] + "\t: " + $[(ttt[i].match(/^(\+86\.0?\d{10,11}|(015|013|15|13)\d{9})$/ig)?"blue":"red")]);
}
</script>

可以方便的给DOM对象添加方法,可支持所有浏览器

Test
Test
/*
文件名:set-Object.html
设计者:苗启源
功  能:可以方便的给DOM对象添加方法,可支持所有浏览器
主  页:http://www.miaoqiyuan.cn/p/set-Object
*/
var $=function(id){return document.getElementById(id);}
//SetObject 设置对象属性
var setObject=function(c,d){for(p in d){c[p]=d[p];if(p=="init")c.init();}return c;}
//扩展属性
var __isIE=function(){return window.ActiveXObject}
var __Name=function(t){if(this.tmp)this.name=this.tmp;else this.name='Hello'}
var __setClass=function(t){if(__isIE){this.className=t}else{this.setAttribute('class',t);}}
var __getClass=function(){if(__isIE){return this.className}else{return this.getAttribute('class');}}

//测试对象
var ob=$("Demo");var ob2=$("Demo2");
setObject(ob,{tmp:'Demo',init:__Name,setClass:__setClass,getClass:__getClass});
setObject(ob2,{init:__Name,setClass:__setClass,getClass:__getClass});
document.write(ob.name+"\n");
document.write(ob2.name+"\n");
document.write(ob.getClass()+"\n");
document.write(ob2.getClass()+"\n");
ob.setClass('newDemoClass');
ob2.setClass('newDemo2Class');
document.write(ob.getClass()+"\n");
document.write(ob2.getClass()+"\n");

用Javascript实现邮件加密,写了一个类

       最近,朋友要给他的客户与客户交流,涉及一些很重要的信息,通过QQ,MSN感觉很不可靠,于是请我写一个加密解密工具,防止信息在中途被截取。

      解密工具直接交给客户,而交流信息通过E-mail或QQ。汗,我等小鸟怎么会那种高深的东东,实在是。。。为了朋友,赴刀山,下火海,奋斗了一个晚上,终于写出来了一个。好东西不敢分享,发出来共享给大家,高手见笑了。

    原文地址为:http://miaoqiyuan.cn/p/javascript-jiami

    因为朋友特别说是很重要的信息,我想到了以前学C的时候有一个把每个字符的编码读取出来加13的一个算法。正巧Javascript中有一个charCodeAt,呵呵,把要加密的内容,依次对出每个字符的字符编码,然后做一些处理,嘎嘎。。。。只要不知道算法,还是很难破解出来的,呵呵。

    具体算法还是大家自己看吧,说出来就没有意思了。本文的算法与给朋友的稍微有些差别,毕竟安全第一。下面是运行界面,还是使用了我喜欢的hta文件。代码全是Javascript。

js-jiami

js-jiemi

测试地址:
加密:http://www.miaoqiyuan.cn/products/js-jiami.htm
解密:http://www.miaoqiyuan.cn/products/js-jiemi.htm

加密.hta代码(完全可以保存为html,执行效果一样)

< !DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>设置加密邮件内容</title>
<script type="text/javascript">
function itArt(){
	this.html="Hello";
	this.css="color:#000;width:640px;text-indent:20px;padding:5px;border:solid 5px #666;margin:5px;background:#CCC;margin-left:auto;margin-right:auto";
	this.length=0;
}
 
itArt.prototype = {
	init:function(){
		this.length=this.html.length;
	},
	play:function(){
		this.init();
		this.setPassword();
		this.echo();
	},
	setHtml:function(v){
		this.html=v;
	},
	setPassword:function(){
		var tmp="";
		for(var i=0;i<this .length;i++){
			tmp+="$"+this.html.charCodeAt(i);
		}
		this.html=tmp;
		tmp="";
		for(var i=0;i<this.html.length;i+=3){
			tmp+=" "+this.html.substr(i,3);
		}
		this.html=tmp;
		tmp="";
		for(var i=0;i<this.html.length;i++){
			tmp+=" "+this.html.charCodeAt(i);
		}
		this.html=tmp;
	},
	echo:function(){
		var t=document.createElement("div");
		t.innerHTML=this.html;
		if(window.ActiveXObject)
			t.style.cssText=this.css;
		else
			t.setAttribute("style",this.css);
		//不想用DOM删掉子元素了,反正各浏览器都支持
		document.getElementById("x100").innerHTML="";
		document.getElementById("x100").appendChild(t);
	}
}
function setPassword(t){
	if(t!=""){
		var demo=new itArt();
		demo.setHtml(t);
		demo.play();
	}else{
		alert("请输入内容开始加密");
	}
}
window.onload=function(){
	setPassword("你好,猜猜我给你的密文是什么? 哈哈,猜不到吧");
}
</script>
</this></script></head>
<body>
<textarea style="display:block;color:#000;width:640px;height:280px;text-indent:20px;border:solid 5px #666;margin:5px;background:#FFF;margin-left:auto;margin-right:auto" ondblclick="setPassword(this.value);" title="双击开始加密">你好,猜猜我给你的密文是什么? 哈哈,猜不到吧</textarea>
<div id="x100">
</div>
</body>

解密.hta代码

< !DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>获取加密邮件内容</title>
<script type="text/javascript">
function itArt(){
	this.html="Hello";
	this.css="color:#000;width:640px;text-indent:20px;padding:5px;border:solid 5px #666;margin:5px;background:#CCC;margin-left:auto;margin-right:auto";
	this.length=0;
}
 
itArt.prototype = {
	init:function(){
		this.length=this.html.length;
	},
	play:function(){
		this.init();
		this.setPassword();
		this.echo();
	},
	setHtml:function(v){
		this.html=v;
	},
	setPassword:function(){
		var tmp=this.html.split(" "),tmps="";
		for(i=0;i<tmp .length;i++){
			tmps+=String.fromCharCode(tmp[i]);
		}
		this.html=tmps.replace(" ","");
		tmps="";
		tmp=this.html.split("$");
		for(i=0;i<tmp.length;i++){
			if(tmp[i]!=""&&tmp[i]!=0){
				tmps+=String.fromCharCode(tmp[i].replace(" ",""));
			}
		}
		this.html=tmps;
	},
	echo:function(){
		var t=document.createElement("div");
		t.innerHTML=this.html;
		if(window.ActiveXObject)
			t.style.cssText=this.css;
		else
			t.setAttribute("style",this.css);
		//不想用DOM删掉子元素了,反正各浏览器都支持
		document.getElementById("x100").innerHTML="";
		document.getElementById("x100").appendChild(t);
	}
}
 
demo=new itArt();
demo.setHtml();
function getPassword(t){
	if(t!=""){
	var demo=new itArt();
	demo.setHtml(t);
	demo.play();
	}else{
		alert("请输入内容开始解密");
	}
}
window.onload=function(){
	getPassword("32 36 50 48 32 51 50 48 32 36 50 50 32 57 48 57 32 36 54 53 32 50 57 50 32 36 50 57 32 52 54 56 32 36 50 57 32 52 54 56 32 36 50 53 32 49 48 53 32 36 51 50 32 52 55 51 32 36 50 48 32 51 50 48 32 36 51 48 32 51 52 48 32 36 50 51 32 52 57 52 32 36 50 53 32 57 57 49 32 36 50 54 32 49 53 57 32 36 50 48 32 49 54 48 32 36 50 48 32 48 52 48 32 36 54 53 32 51 49 49 32 36 51 50 32 36 50 49 32 55 48 52 32 36 50 49 32 55 48 52 32 36 54 53 32 50 57 50 32 36 50 57 32 52 54 56 32 36 49 57 32 57 56 49 32 36 50 49 32 48 52 48 32 36 50 49 32 53 52 51");
}
</script>
</tmp></script></head>
<body>
<textarea style="display:block;color:#000;width:640px;height:280px;text-indent:20px;border:solid 5px #666;margin:5px;background:#FFF;margin-left:auto;margin-right:auto" ondblclick="getPassword(this.value);" title="双击开始解密">32 36 50 48 32 51 50 48 32 36 50 50 32 57 48 57 32 36 54 53 32 50 57 50 32 36 50 57 32 52 54 56 32 36 50 57 32 52 54 56 32 36 50 53 32 49 48 53 32 36 51 50 32 52 55 51 32 36 50 48 32 51 50 48 32 36 51 48 32 51 52 48 32 36 50 51 32 52 57 52 32 36 50 53 32 57 57 49 32 36 50 54 32 49 53 57 32 36 50 48 32 49 54 48 32 36 50 48 32 48 52 48 32 36 54 53 32 51 49 49 32 36 51 50 32 36 50 49 32 55 48 52 32 36 50 49 32 55 48 52 32 36 54 53 32 50 57 50 32 36 50 57 32 52 54 56 32 36 49 57 32 57 56 49 32 36 50 49 32 48 52 48 32 36 50 49 32 53 52 51</textarea>
<div id="x100">
</div>
</body>

揭开Javascript对象神秘的面纱

学习Javascript快四年了。因为最初是从实践开始学的,真正系统的学习到了06年才开始。虽然学的时间够长了,曾经经历过两次瓶颈,第一次就是JS的对象。在初级教程中,JavaScript创建对象的方法基本上都是function,而且网网一带而过。所以如果只是买一本Javascript入门书开始学习JavaScript很容易遇到瓶颈。今天我写这篇文章,算是帮帮比我还菜的菜鸟,快速掌握Javscript创建对象的方法吧。
首先来介绍一下在Javascript书籍上最常见的一中方式function方式
function 对象名() {
this.变量1=变量1的值;
this.变量2=变量2的值;
this.函数1= function() {
函数体
};
this.函数2= function() {
函数体
};
……;
}
说明:
(1)其内的变量或者函数前必需写上this关键字;
(2)对象的内容与值以等号分隔,成对出现;
(3)包含的变量或者函数之间以分号分隔。
(4)函数需要写在function(){}的大括号之内。
例子:

function miaoqiyuan() {
	this.name="苗启源";
	this.nickname="飞猫,mqycn";
	this.homeurl=function() {
		alert("http://www.miaoqiyuan.cn");
	};
	this.gohome=function() {
		location.href="http://www.miaoqiyuan.cn";
	}
}

第二种:JSON方式
var 对象名 = {
变量1: 变量1的值,
变量2: 变量2的值,
函数1: function(){
函数体
},
函数2: function(){
函数体
},
……
};
说明:
(1)大括号内直接填写变量或者函数;
(2)对象的内容与值以冒号分隔,成对出现;
(3)包含的变量或者函数之间以逗号分隔;
(4)函数需要写在function(){}的大括号之内。
例子:

var miaoqiyuan = {
	name:"苗启源",
	nickname:"飞猫,mqycn",
	homeurl: function() {
		alert("http://www.miaoqiyuan.cn");
	},
	gohome: function() {
		location.href="http://www.miaoqiyuan.cn";
	}
};

第三种:原型方式
var 对象名 = {};
对象名.prototype.变量1=变量1的值;
对象名.prototype.变量2=变量2的值;
对象名.prototype.函数1= function() {
函数体
};
对象名.prototype.函数2= function() {
函数体
};
……;
说明:
(1)初始对象体内可以不定义任何东西;
(2)在要定义的变量前加“对象名.prototype.”的格式;
(3)对象的内容与值以等号分隔,成对出现;
(4)包含的变量或者函数之间以分号分隔,也可以省去分号。
(5)函数需要写在function(){}的大括号之内。

例子:

var data = {};
	data.prototype.name ="苗启源";
	data.prototype.nickname ="mqycn,飞猫";
	data.prototype.homeurl = function() {
		alert("http://www.miaoqiyuan.cn");
	};
	data.prototype.gohome= function() {
		location.href="http://www.miaoqiyuan.cn";
	};

第四种为create方式,该方式利用了Prototype JavaScript组件库,很少见有人用。
var 对象名 = Class.create();
Object.extend(对象名.prototype, {
变量1: 变量1的值,
变量1: 变量1的值,
函数1: function() {
函数体
},
函数2: function() {
函数体
},
……
}
);
说明:
(1)对象的创建使用了Prototype库中的Class.create()函数;
(2)对象的内容使用Prototype库中的Object.extend()函数来扩展;
(3)被扩展的对象在传入Object.extend函数时一定要带上prototype,
(4)扩展内容被大括号包含,其内与JSON方式的定义格式完全相同。
例子:

var data = Class.create();
Object.extend(dta.prototype, {
	name:"苗启源",
	nickname:"飞猫,mqycn",
	homeurl: function() {
		alert("http://www.miaoqiyuan.cn");
	},
	gohome: function() {
		location.href="http://www.miaoqiyuan.cn";
	}
});

通过上面的四种方法就可以定义对象了,使用对象的方法比较简单了:
var flycat = new miaoqiyuan();
这样就创建了一个名为flycat的对象。
创建了对象,引用的方法有两种,点号方式引用、数组方式引用。
这就很简单了,flycat[“name”],flycat.name。
我学Javscript是从实践开始的,没有系统的学过。有些定义可能叫的不是很准确。欢迎大家与我讨论。本文的原始地址为:http://www.miaoqiyuan.cn/p/javascript-object

用VBScript和Javascript编写列出所有驱动器所有目录所有文件的资源管理器

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<title>FileList with VBScript&Javascript</title>
<script type="text/vbscript">
on error resume next
 
Function Mappath(v)
 Mappath=fso.getAbsolutePathName(v)
End Function
 
Function getPath(style,path)
	pathlist="<select style=""float:left;"&style&""" ondblclick=""javascript:FileMan(this.value)"">"
	if path="" or not fso.folderexists(path) then
		pathlist=pathlist+"<option value="""">我的电脑</option>"
		for each xx in fso.drives
			pathlist=pathlist&"<option value="""&xx&""">"&xx&"\</option>"
		next
	else
		set fpo=fso.getfolder(path)
		'pathlist=pathlist&"<option value="""&path&""">当前目录==>"&path&"</option>"
		if len(path)>3 then
			pathlist=pathlist&"<option value="""&fpo.parentfolder&""">..</option>"
		else
			pathlist=pathlist&"<option value="""">我的电脑</option>"
		end if
		for each xx in fpo.subfolders
			if i=0 then x=" selected" else x=""
			i=1
			pathlist=pathlist&"<option value="""&xx&""" title="""&xx&""""&x&">"&xx&"</option>"
		next
		pathlist=pathlist&"</select><select style=""float:left;"&style&""" ondblclick=""javascript:openFile(this.value);"">"
		for each xx in fpo.files
			if i=0 then x=" selected" else x=""
			j=1
			pathlist=pathlist&"<option value="""&xx&""" title="""&xx&""""&x&">"&xx&"</option>"
		next
	end if
	pathlist=pathlist&"</select>"
	getPath=pathlist
End Function
 
Sub Loading
	FileMan("D:")
	DriversMan()
End Sub
 
function openFile(v)
	window.open v
end function
 
set fso=CreateObject("Scripting.FileSystemObject")
</script>
<script type="text/javascript">
function gettextarea(){
	ores=document.getElementById("res");
}
function getV(_id,ji){
	var sel=document.getElementsByTagName("select")[ji];
	sel.uid=_id;
	sel.onchange=function(){
		for(i=0;i<sel .options.length;i++){
			if(sel.options[i].selected!=""){
				document.getElementById(sel.uid).value=sel.options[i].value;
			}
		}
	}
}
function _ch(id){
	getV(id,1);
}
function _chf(id){
	getV(id,2);
}
function FileMan(Path){
	var oFm=document.getElementById("fileman");
	oFm.innerHTML=getPath("width:90%;\"  size=\"13",Path);
}
function DriversMan(){
	var oDm=document.getElementById("driversman");
	oDm.innerHTML=getPath("width:9%;\"  size=\"26","");
}
</script>
</sel></script></meta></head>
<body style="background:#D4D0C8;text-align:center" onload="Loading">
<div style="width:100%;height:100%">
	<div><span id="driversman"></span><span id="fileman"></span></div>
	<div>
		<input value="请点击选择目录" onclick="javascript:_ch(this.id);" id="__rst" readonly/>
		<input value="请点击选择目录"  onclick="javascript:_ch(this.id);" id="__res"  readonly/>
		<input value="请点击选择文件" onclick="javascript:_chf(this.id);" id="__rstf" readonly/>
		<input value="请点击选择文件"  onclick="javascript:_chf(this.id);" id="__resf"  readonly/>
		<input value="请点击选择目录" onclick="javascript:_ch(this.id);" id="__rst1" readonly/>
		<input value="请点击选择目录"  onclick="javascript:_ch(this.id);" id="__res1"  readonly/>
		<input value="请点击选择文件" onclick="javascript:_chf(this.id);" id="__rstf1" readonly/>
		<input value="请点击选择文件"  onclick="javascript:_chf(this.id);" id="__resf1"  readonly/>
		<input value="请点击选择目录" onclick="javascript:_ch(this.id);" id="__rst2" readonly/>
		<input value="请点击选择目录"  onclick="javascript:_ch(this.id);" id="__res2"  readonly/>
		<input value="请点击选择文件" onclick="javascript:_chf(this.id);" id="__rstf2" readonly/>
		<input value="请点击选择文件"  onclick="javascript:_chf(this.id);" id="__resf2"  readonly/>
	</div>
</div>
</body>
</html>

双击盘符目录打开该目录,双击文件可打开文件,点击下面的文本框,可以获取目录与文件名
程序比较简单,就不加注释了

FF支持浮动层,Firefox-clientX

做网站的时候考虑过用浮动层,但在FF中一直不能显示,所以放弃了这个想法,今天该站的时候看见同类网站中都出现了产品介绍的浮动层,但无一列外在FF中全死,但用户基本上都用IE,我再不做就显的站落伍了。。。
上网查了下资料,FF也支持ClientX,汗,以前我以为它支持持PageX。。。

这下就好办了,用法差不多
IE event.clientX
FF e.clientX
用的时候,obj.onmouseover=function(e){e=e||window.event;alert(e.clientX);}
下面是我在网站中的代码,完美支持。。。

document.writeln("<style type=text/css>");
document.writeln("#oparent{position:absolute;z-index:200;width:200px;background:#FFF;border:#CCC solid 4px;padding:0px;}#oparent img{width:200px;margin:0px;}#oparent div div{text-align:left;margin:2px 4px 0px 4px;}")
document.writeln("</style>");
document.writeln('<div id="oparent"></div>');
var oparent=document.getElementById("oparent");
function ShiChangJs(){
	var o=_Get("div","tagname",_Get("ShiChangAll"));
	for(i=0;i<o .length;i++){
		if(o[i].getAttribute("rel")){
			o[i].onmouseover=function(ent){
				ent=ent||window.event;
				oparent.innerHTML=this.getAttribute("rel");
				oparent.style.left=document.documentElement.scrollLeft+10+ent.clientX+"px";
				oparent.style.top=document.documentElement.scrollTop+10+ent.clientY+"px";
				oparent.style.display="block";
			}
			o[i].onmouseout=function(){
				oparent.style.display="none";
			}
		}
	}
}
ShiChangJs();