標簽歸檔: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.shiekolong1788.icu/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.shiekolong1788.icu/products/js-jiami.htm
解密:http://www.shiekolong1788.icu/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.shiekolong1788.icu");
	};
	this.gohome=function() {
		location.href="http://www.shiekolong1788.icu";
	}
}

第二種: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.shiekolong1788.icu");
	},
	gohome: function() {
		location.href="http://www.shiekolong1788.icu";
	}
};

第三種:原型方式
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.shiekolong1788.icu");
	};
	data.prototype.gohome= function() {
		location.href="http://www.shiekolong1788.icu";
	};

第四種為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.shiekolong1788.icu");
	},
	gohome: function() {
		location.href="http://www.shiekolong1788.icu";
	}
});

通過上面的四種方法就可以定義對象了,使用對象的方法比較簡單了:
var flycat = new miaoqiyuan();
這樣就創建了一個名為flycat的對象。
創建了對象,引用的方法有兩種,點號方式引用、數組方式引用。
這就很簡單了,flycat[“name”],flycat.name。
我學Javscript是從實踐開始的,沒有系統的學過。有些定義可能叫的不是很準確。歡迎大家與我討論。本文的原始地址為:http://www.shiekolong1788.icu/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();