小小工程師的生活雜記: 網頁

顯示具有網頁標籤的文章。顯示所有文章

2010年3月22日星期一

在javascript中抓取陣列資料

記錄在javascript中如何取得在HTML中的陣列資料
以及如何將之讀取出來

一般來說，我們在javascript裡使用的陣列型態的方法如下
例:


//宣告
var url_arr=new Array('software.sopili.net','dev.sopili.net');
//讀取
for(var i in url_arr){document.write(url_arr[i]+'
');}

那，如果想要像php一樣，array的key值是用字串
例:


$url_arr=Array('software'=>'software.sopili.net','dev'=>'dev.sopili.net');
foreach($url_arr as $key=>$value){
echo $key."
";
//重點是 key，有時候非常的需要key這個值，然後是字串型態
}

這時候要用JSON的格式
例:


//宣告
var url_arr={'software':'software.sopili.net','dev':'dev.sopili.net'};
//讀取
for(var key in url_arr){
//這裡面的key值，就真的是字串了！
document.write(url_arr[key]+'
');
}

接下來,要如何從html裡面讀取陣列的值呢?
假使資料來源如下:


<input name="education[]" type="text" size="20" maxlength="40" />
<input name="education[]" type="text" size="20" maxlength="40" />
<input name="education[]" type="text" size="20" maxlength="40" />

PHP的用法很簡單,直接使用"education"這個名稱就好
例:


foreach($_POST['education'] as $key=>$value) echo $key.' '.$value;

javascript的麻煩一點,但差不多的用法
例:


var mutli_education = document.form_name.elements["education[]"];
for(i=0;i < mutli_education.length;i++){ alert(mutli_education[i].value);}

參考資料:
1.http://dev.sopili.net/2008/11/javascriptarraykey_6376.html
2.http://roshanbh.com.np/2008/08/handling-array-html-form-elements-javascript-php.html
記錄在javascript中如何取得在HTML中的陣列資料
以及如何將之讀取出來

一般來說，我們在javascript裡使用的陣列型態的方法如下
例:


//宣告
var url_arr=new Array('software.sopili.net','dev.sopili.net');
//讀取
for(var i in url_arr){document.write(url_arr[i]+'
');}

那，如果想要像php一樣，array的key值是用字串
例:


$url_arr=Array('software'=>'software.sopili.net','dev'=>'dev.sopili.net');
foreach($url_arr as $key=>$value){
echo $key."
";
//重點是 key，有時候非常的需要key這個值，然後是字串型態
}

這時候要用JSON的格式
例:


//宣告
var url_arr={'software':'software.sopili.net','dev':'dev.sopili.net'};
//讀取
for(var key in url_arr){
//這裡面的key值，就真的是字串了！
document.write(url_arr[key]+'
');
}

接下來,要如何從html裡面讀取陣列的值呢?
假使資料來源如下:


<input name="education[]" type="text" size="20" maxlength="40" />
<input name="education[]" type="text" size="20" maxlength="40" />
<input name="education[]" type="text" size="20" maxlength="40" />

PHP的用法很簡單,直接使用"education"這個名稱就好
例:


foreach($_POST['education'] as $key=>$value) echo $key.' '.$value;

javascript的麻煩一點,但差不多的用法
例:


var mutli_education = document.form_name.elements["education[]"];
for(i=0;i < mutli_education.length;i++){ alert(mutli_education[i].value);}

參考資料:
1.http://dev.sopili.net/2008/11/javascriptarraykey_6376.html
2.http://roshanbh.com.np/2008/08/handling-array-html-form-elements-javascript-php.html

2008年8月14日星期四

HTML字符編碼大全

在網頁中輸入特殊字符，需在html代碼中加入以&開頭的字母組合或以&#開頭的數字。例如，版權標誌符©即是用©或©表示。
常用符號“<”、">"、"&"、"空格"分別用“<”、“>”、“&”、“ ”表示，注意這些符號對大小寫是敏感的。
下面就是以字母或數字表示的特殊符號大全。

字母編碼	數字編碼	效果	說明
	-		沒被使用
			horizontal tab
			line feed
			沒被使用
			空格
	!	!
"	"	"
	#	#
	$	$
	%	%
&	&	&
	'	'
	(	(
	)	)
	*	*
	+	+
	,	,
	-	-
	.	.
	/	/
	0- 9		數字從0到9
	:	:
	;	;
<	<	<
	=	=
>	>	>
	?	?
	@	@
	A- Z		大寫字母從A到Z
	[	[
	\	\
	]	]
	^	^
	_	_
	`	`
	a-z		小寫字母從A到Z
	{	{
	\|	\|
	}	}
	~	~

	-		沒被使用
		‚
		ƒ
		„
		…
		†
		‡
		ˆ
		‰
		Š
		‹
		Œ
	-		沒被使用
		‘
		’
		“
		”
		•
		–
		—
		˜
		™
		š
		›
		œ
	-		沒被使用
		Ÿ
			不換行空格
	¡	¡
	¢	¢
	£	£
	¤	¤
	¥	¥
	¦	¦
	§	§
	¨	‥
©	©	©
	ª	ª
	«	«
	¬	¬

®	®	®
	¯	¯
	°	°
	±	±
	²	²
	³	³
	´	´
	µ	µ
	¶	¶
	·	·
	¸	¸
	¹	¹
	º	º
	»	»
	¼	¼
	½	½
	¾	¾
	¿	¿
À	À	À
Á	Á	Á
Â	Â	Â
Ã	Ã	Ã
Ä	Ä	Ä
Å	Å	Å
Æ	Æ	Æ
Ç	Ç	Ç
È	È	È
É	É	É
Ê	Ê	Ê
Ë	Ë	Ë
Ì	Ì	Ì
Í	Í	Í
Î	Î	Î
Ï	Ï	Ï
Ð	Ð	Ð
Ñ	Ñ	Ñ
Ò	Ò	Ò
Ó	Ó	Ó
Ô	Ô	Ô
Õ	Õ	Õ
Ö	Ö	Ö
	×	×
Ø	Ø	Ø
Ù	Ù	Ù
Ú	Ú	Ú
Û	Û	Û
Ü	Ü	Ü
Ý	Ý	Ý
Þ	Þ	Þ
ß	ß	ß
à	à	à
á	á	á
â	â	â
ã	ã	ã
ä	ä	ä
å	å	å
æ	æ	æ
ç	ç	ç
è	è	è
é	é	é
ê	ê	ê
ë	ë	ë
ì	ì	ì
í	í	í
î	î	î
ï	ï	ï
ð	ð	ð
ñ	ñ	ñ
ò	ò	ò
ó	ó	ó
ô	ô	ô
õ	õ	õ
ö	ö	ö
	÷	÷
ø	ø	ø
ù	ù	ù
ú	ú	ú
û	û	û
ü	ü	ü
ý	ý	ý
þ	þ	þ
ÿ	ÿ	ÿ
	’	’	老版本瀏覽器不支援
	“	“	老版本瀏覽器不支援
	”	”	老版本瀏覽器不支援
€	€	?	老版本瀏覽器不支援

HTML字符編碼大全

字母編碼	數字編碼	效果	說明
	-		沒被使用
			horizontal tab
			line feed
			沒被使用
			空格
	!	!
"	"	"
	#	#
	$	$
	%	%
&	&	&
	'	'
	(	(
	)	)
	*	*
	+	+
	,	,
	-	-
	.	.
	/	/
	0- 9		數字從0到9
	:	:
	;	;
<	<	<
	=	=
>	>	>
	?	?
	@	@
	A- Z		大寫字母從A到Z
	[	[
	\	\
	]	]
	^	^
	_	_
	`	`
	a-z		小寫字母從A到Z
	{	{
	\|	\|
	}	}
	~	~

	-		沒被使用
		‚
		ƒ
		„
		…
		†
		‡
		ˆ
		‰
		Š
		‹
		Œ
	-		沒被使用
		‘
		’
		“
		”
		•
		–
		—
		˜
		™
		š
		›
		œ
	-		沒被使用
		Ÿ
			不換行空格
	¡	¡
	¢	¢
	£	£
	¤	¤
	¥	¥
	¦	¦
	§	§
	¨	‥
©	©	©
	ª	ª
	«	«
	¬	¬

®	®	®
	¯	¯
	°	°
	±	±
	²	²
	³	³
	´	´
	µ	µ
	¶	¶
	·	·
	¸	¸
	¹	¹
	º	º
	»	»
	¼	¼
	½	½
	¾	¾
	¿	¿
À	À	À
Á	Á	Á
Â	Â	Â
Ã	Ã	Ã
Ä	Ä	Ä
Å	Å	Å
Æ	Æ	Æ
Ç	Ç	Ç
È	È	È
É	É	É
Ê	Ê	Ê
Ë	Ë	Ë
Ì	Ì	Ì
Í	Í	Í
Î	Î	Î
Ï	Ï	Ï
Ð	Ð	Ð
Ñ	Ñ	Ñ
Ò	Ò	Ò
Ó	Ó	Ó
Ô	Ô	Ô
Õ	Õ	Õ
Ö	Ö	Ö
	×	×
Ø	Ø	Ø
Ù	Ù	Ù
Ú	Ú	Ú
Û	Û	Û
Ü	Ü	Ü
Ý	Ý	Ý
Þ	Þ	Þ
ß	ß	ß
à	à	à
á	á	á
â	â	â
ã	ã	ã
ä	ä	ä
å	å	å
æ	æ	æ
ç	ç	ç
è	è	è
é	é	é
ê	ê	ê
ë	ë	ë
ì	ì	ì
í	í	í
î	î	î
ï	ï	ï
ð	ð	ð
ñ	ñ	ñ
ò	ò	ò
ó	ó	ó
ô	ô	ô
õ	õ	õ
ö	ö	ö
	÷	÷
ø	ø	ø
ù	ù	ù
ú	ú	ú
û	û	û
ü	ü	ü
ý	ý	ý
þ	þ	þ
ÿ	ÿ	ÿ
	’	’	老版本瀏覽器不支援
	“	“	老版本瀏覽器不支援
	”	”	老版本瀏覽器不支援
€	€	?	老版本瀏覽器不支援

2008年3月28日星期五

php的strpos 以及 javascript的indexOf()

常有機會要去判斷字串裡面是否有某一個字(或句子)
以往都是用php的strstr或strpos來做判斷
但偶爾還是有機會要用到javascript來直接判斷

在javascript裡..用的是indexOf(),以下是摘錄自
JavaScript indexOf() 方法的內容

定義和用法
indexOf() 方法可傳回某個指定的字串值在字串中首次出現的位置。

語法
stringObject.indexOf(searchvalue,fromindex)
參數　　　　　　　　　　說明
searchvalue 必需。欲搜尋的字符值。
fromindex 可選的整數值。規定在字串中開始搜尋的位置。它的合法值是
　　　　　　　　　　　　０到stringObject.length - 1。
　　　　　　　　　　　　如省略此參數，則將從字串的第一個字開始搜尋。

注意：indexOf() 方法有區分大小寫！
注意：如果要搜尋的字串值沒有出現，則傳回-1。

例:


<script type="text/javascript">

var str="Hello world!"
document.write(str.indexOf("Hello") + "<br />")
document.write(str.indexOf("World") + "<br />")
document.write(str.indexOf("world"))

</script>

以上代码的输出：


0
-1
6


<script type="text/javascript">

var str="Hello world!"
document.write(str.indexOf("Hello") + "<br />")
document.write(str.indexOf("World") + "<br />")
document.write(str.indexOf("world"))

</script>

以上代码的输出：


0
-1
6

2008年3月14日星期五

今天發現一個超好用的網站
功能跟igoogle一樣,但更加靈活
先記錄起來...晚點再來玩看看

目前igoogle給我的感覺就是不夠快
東西一放多...在loading就很耗時間...

下面是幾篇針對netvibes所做的介紹
[超優網站]客製化你的首頁，netvibes給你多更多！(上)
[超優網站]客製化你的首頁，netvibes給你多更多！(中)
[超優網站]客製化你的首頁，netvibes給你多更多！(下)
比 iGoogle 好用的 Netvibes 個人化首頁服務
吃了黑米要放屁，手賤順便挖女孩: 3分鐘搞定Netvibes個人化入口網站今天發現一個超好用的網站
功能跟igoogle一樣,但更加靈活
先記錄起來...晚點再來玩看看

目前igoogle給我的感覺就是不夠快
東西一放多...在loading就很耗時間...

下面是幾篇針對netvibes所做的介紹
[超優網站]客製化你的首頁，netvibes給你多更多！(上)
[超優網站]客製化你的首頁，netvibes給你多更多！(中)
[超優網站]客製化你的首頁，netvibes給你多更多！(下)
比 iGoogle 好用的 Netvibes 個人化首頁服務
吃了黑米要放屁，手賤順便挖女孩: 3分鐘搞定Netvibes個人化入口網站

2008年3月4日星期二

Javascript Event 座標

節錄自
Javascript Event 座標

Javascript Event 的mouse座標用法
如果要得知 mouse畫面上的座標位置


function f(e) {
var e=(e)?e:event;
alert(e.clientY) ;
alert(e.clientX) ;
}

如果要得知 mouse頁面上的座標位置


function f(e) {
var e=(e)?e:event;
alert(e.clientY+document.documentElement.scrollTop) ;
alert(e.clientX+document.documentElement.scrollLeft) ;
}

該文章也參考了
Javascript's Event 的一点总结
這邊僅節錄部份內容

主要的差別在於html文件標頭是否有定義html的event事件
例:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>?定? HTML 的 Event 事件</title>
與
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>定義了 HTML's DOCTYPE 的 Event 事件</title>

上述二種不一樣的html標籤,分別適用下述二種不一樣的javascript用法
這是未定義event事件的


<script language="javascript">
function getvalue(e){
    if (!document.all){
        winW = window.innerWidth;
        winH = window.innerHeight;
        curX = e.pageX - window.pageXOffset;
        curY = e.pageY - window.pageYOffset;
        mouX = e.pageX;
        mouY = e.pageY;
        broX = window.pageXOffset;
        broY = window.pageYOffset;
    }else{
        winW = document.body.clientWidth;
        winH = document.body.clientHeight;
        curX = event.clientX;
        curY = event.clientY;
        mouX = event.clientX + document.body.scrollLeft;
        mouY = event.clientY + document.body.scrollTop;
        broX = document.body.scrollLeft;
        broY = document.body.scrollTop;
    }
    alert(" 窗口可见宽度(winW): "+winW+"\n\n 窗口可见高度(winH): "+winH+"\n\n 距窗口左边距离(curX): "+curX+"\n\n 距窗口顶部距离(curY): "+curY+"\n\n 距页面左边距离(mouX): "+mouX+"\n\n 距页面顶部距离(mouY): "+mouY+"\n\n 页面滚动的宽度(broX): "+broX+"\n\n 页面滚动的高度(broY): "+broY);
    return true;
}
document.onclick=getvalue;
</script>

然後,下面是有定義event事件的


<script language="JavaScript" type="text/javascript">
function getvalue(e){
    if (!document.all){
        winW = window.innerWidth;
        winH = window.innerHeight;
        curX = e.pageX - window.pageXOffset;
        curY = e.pageY - window.pageYOffset;
        mouX = e.pageX;
        mouY = e.pageY;
        broX = window.pageXOffset;
        broY = window.pageYOffset;
    }else{
        winW = document.documentElement.clientWidth;
        winH = document.documentElement.clientHeight;
        curX = event.clientX;
        curY = event.clientY;
        mouX = event.clientX + document.documentElement.scrollLeft;
        mouY = event.clientY + document.documentElement.scrollTop;
        broX = document.documentElement.scrollLeft;
        broY = document.documentElement.scrollTop;
    }
    alert(" 窗口可见宽度(winW): "+winW+"\n\n 窗口可见高度(winH): "+winH+"\n\n 距窗口左边距离(curX): "+curX+"\n\n 距窗口顶部距离(curY): "+curY+"\n\n 距页面左边距离(mouX): "+mouX+"\n\n 距页面顶部距离(mouY): "+mouY+"\n\n 页面滚动的宽度(broX): "+broX+"\n\n 页面滚动的高度(broY): "+broY);
    return true;
}
document.onclick=getvalue;
</script>

可以看出最主要的差異在
document.body 變成了 document.documentElement。
節錄自
Javascript Event 座標

Javascript Event 的mouse座標用法
如果要得知 mouse畫面上的座標位置


function f(e) {
var e=(e)?e:event;
alert(e.clientY) ;
alert(e.clientX) ;
}

如果要得知 mouse頁面上的座標位置


function f(e) {
var e=(e)?e:event;
alert(e.clientY+document.documentElement.scrollTop) ;
alert(e.clientX+document.documentElement.scrollLeft) ;
}


<script language="javascript">
function getvalue(e){
    if (!document.all){
        winW = window.innerWidth;
        winH = window.innerHeight;
        curX = e.pageX - window.pageXOffset;
        curY = e.pageY - window.pageYOffset;
        mouX = e.pageX;
        mouY = e.pageY;
        broX = window.pageXOffset;
        broY = window.pageYOffset;
    }else{
        winW = document.body.clientWidth;
        winH = document.body.clientHeight;
        curX = event.clientX;
        curY = event.clientY;
        mouX = event.clientX + document.body.scrollLeft;
        mouY = event.clientY + document.body.scrollTop;
        broX = document.body.scrollLeft;
        broY = document.body.scrollTop;
    }
    alert(" 窗口可见宽度(winW): "+winW+"\n\n 窗口可见高度(winH): "+winH+"\n\n 距窗口左边距离(curX): "+curX+"\n\n 距窗口顶部距离(curY): "+curY+"\n\n 距页面左边距离(mouX): "+mouX+"\n\n 距页面顶部距离(mouY): "+mouY+"\n\n 页面滚动的宽度(broX): "+broX+"\n\n 页面滚动的高度(broY): "+broY);
    return true;
}
document.onclick=getvalue;
</script>

然後,下面是有定義event事件的


<script language="JavaScript" type="text/javascript">
function getvalue(e){
    if (!document.all){
        winW = window.innerWidth;
        winH = window.innerHeight;
        curX = e.pageX - window.pageXOffset;
        curY = e.pageY - window.pageYOffset;
        mouX = e.pageX;
        mouY = e.pageY;
        broX = window.pageXOffset;
        broY = window.pageYOffset;
    }else{
        winW = document.documentElement.clientWidth;
        winH = document.documentElement.clientHeight;
        curX = event.clientX;
        curY = event.clientY;
        mouX = event.clientX + document.documentElement.scrollLeft;
        mouY = event.clientY + document.documentElement.scrollTop;
        broX = document.documentElement.scrollLeft;
        broY = document.documentElement.scrollTop;
    }
    alert(" 窗口可见宽度(winW): "+winW+"\n\n 窗口可见高度(winH): "+winH+"\n\n 距窗口左边距离(curX): "+curX+"\n\n 距窗口顶部距离(curY): "+curY+"\n\n 距页面左边距离(mouX): "+mouX+"\n\n 距页面顶部距离(mouY): "+mouY+"\n\n 页面滚动的宽度(broX): "+broX+"\n\n 页面滚动的高度(broY): "+broY);
    return true;
}
document.onclick=getvalue;
</script>

可以看出最主要的差異在
document.body 變成了 document.documentElement。

2007年10月2日星期二

Apache 檔案上傳限制設定

要修改的地方有二個
1.Apache的httpd.conf
2.PHP的phi.ini

httpd.conf的部份


< f i l e s >
SetOutputFilter PHP
SetInputFilter PHP
LimitRequestBody 524288
註:524288是512*1024,單位為bit
< / f i l e s >

php.ini的部份
;;;;;;;;;;;;;;;;;;; ; Resource Limits ; ;;;;;;;;;;;;;;;;;;; max_execution_time = 20000 ;Maximum execution time of each script, in seconds max_input_time = 20000 ; Maximum amount of time each script may spend parsing request data memory_limit = 50M ; Maximum amount of memory a script may consume (50MB,default =8MB) post_max_size = 50M ; Maximum size of POST data that PHP will accept. ;;;;;;;;;;;;;;;; ; File Uploads ; ;;;;;;;;;;;;;;;; ; Whether to allow HTTP file uploads. file_uploads = On ; Temporary directory for HTTP uploaded files (will use system default if not ; specified). ;upload_tmp_dir = ; Maximum allowed size for uploaded files. upload_max_filesize = 100M

要修改的地方有二個
1.Apache的httpd.conf
2.PHP的phi.ini

httpd.conf的部份


< f i l e s >
SetOutputFilter PHP
SetInputFilter PHP
LimitRequestBody 524288
註:524288是512*1024,單位為bit
< / f i l e s >

2007年8月23日星期四

無間斷圖片跑馬燈

在男丁格爾's 脫殼玩
那看到了一種做法無間斷圖片跑馬燈
看似不錯,但畫面會被拉長...

因綠際會下...不小心在網路上找到了下面這方法
唯因為原作者己不可考...故無法列出處(若原作者有看到,請來信通知,好讓我補上,謝謝)

原始程式如下....原作者的註解我就不做更動
中文部份是我自己加上的註解


//這是要滾動的內容,最好用div包起來
<div id="scrollbarDemo">
這裡是要滾動的內容
</div>

<SCRIPT type="text/javascript">
//這一塊是主要程式運作的地方
var __scrollBarControl = null;
var __divinnerHTML=null;
var __firstTime=true;
function innerBarProp(barID, width, height, interval, direction)
{
　this.barID = barID;
　this.width = width;
　this.height = height;
　this.interval = interval;
　this.direction = direction;
　this.stopScroll = false;
　this.maxValue = 0;
　this.preValue = 0;
}
function scrollBar()
{
　this.barsArray = new Array();
　//save current object
　__scrollBarControl = this;
}
//////////////////////////////////////////////////////////////////
// add scrollbar to bar list and set properties
// parameters:
//     barID: HTML's tag <DIV>'s id property 
//              (for js access the DIV object)
//     width: define the scrollbar's width
//     height: define the scrollbar's height
//     interval: define the scroll speed 
//               ( scroll up/down per XX millinSecond )
//     direction: scroll direction's defined
//               "up"
//               "down"
//               "left"
//               "right"
//////////////////////////////////////////////////////////////////
scrollBar.prototype.addBar = function(barID, width, height, interval, direction)
{
　//check parameters
　var paraCount = arguments.length;
　if ( paraCount < 1 )
　{
　　alert("parameters count incorect!");
　　return;
　　//throw "parameters count inccorect!";
　}
 
　//width's default value
　if ( typeof( width ) == "undefined" )
　{
　　var width = 100;
　}
 
　//height's default value
　if ( typeof( height ) == "undefined" )
　{
　　var height = 100;
　}
 
　//interval's default value
　if ( typeof( interval ) == "undefined" )
　{
　　var interval = 1000;
　}
　
　//direction's default value
　if ( typeof( direction ) == "undefined" )
　{
　　var direction = "up";
　}
 
　//create scrollbar's inner properties
　var barProp = new innerBarProp(barID, width, height, interval, direction);
　var objBar = document.getElementById(barID);
　if(__divinnerHTML!=null)
　　objBar.innerHTML=__divinnerHTML;
　else
　　__divinnerHTML=objBar.innerHTML;
　var barCount = this.barsArray.length;
　this.barsArray[barCount] = barProp;
}
scrollBar.prototype.clear = function()
{
　for(i=0;i<this.barsArray.length;i++)
　　this.barsArray.pop();
}
scrollBar.prototype.createScrollBars = function()
{
　//get bar's count
　var barCount = this.barsArray.length;
　//if no bar add to scrollControl do nothing
　if ( barCount == 0 )
　{
　　return;
　}
 
　//init scroll bars
　for ( var i=0; i<barCount; i++ )
　{
　　var objBarID = this.barsArray[i].barID;
　　//if typeof objBarID is object
　　// that's meaning it inited
　　//if typeof objBarID is string
　　// init that scroll bar
　　if ( typeof( objBarID ) == "string" )
　　{
　　　//get scroll <DIV> object
　　　var objBar = document.getElementById( objBarID ); 
　　　if (objBar == null)
　　　{
　　　　//objBarID is not exist
　　　　if ( document.readyState == "complete" || document.readyState == "loaded" )
　　　　{
　　　　　//the objBarID not exists in current document
　　　　　//throw "the objBarID is not exists.";
　　　　　alert("ScrollBar[" + objBarID + "]: not exist!");
　　　　　return;
　　　　}
　　　　else
　　　　{
　　　　　//wait for document to load objBarID
　　　　　window.setTimeout("__scrollBarControl.createScrollBars()",50);
　　　　　//exit processing..........
　　　　　//and wait next time callbak
　　　　　return;
　　　　}
　　　}
　　　//update barID
　　　this.barsArray[i].barID = objBar;
　　}
　}
 
　for ( var i=0; i<barCount; i++ )
　{
　　this.innerInitBar(i);
　}
}
scrollBar.prototype.innerInitBar = function (index)
{ 
　//get properties
　var barID = this.barsArray[index].barID;
　var width = this.barsArray[index].width;
　var height = this.barsArray[index].height;
　var interval = this.barsArray[index].interval;
　var direction = this.barsArray[index].direction;
　var maxValue = 0;
 
　//set scrollBar's properties
　with(barID)
　{
　　style.width = width;
　　style.height = height;
　　noWrap=true;
　　switch( direction )
　　{
　　　//這裡是實際決定滾動方向及內容的地方
　　　//有up,down,left,right
　　　case "up":
　　　　maxValue = Math.max(scrollHeight, height);
　　　　style.overflowX = "visible";
　　　　style.overflowY = "hidden";
　　　　//宣告barHtml來放代入的div裡面的內容
　　　　var barHtml = innerHTML;
　　　　//將之複製二次,並擺在一個table裡面
　　　　//若外面傳入的div裡面的table己寫好
　　　　//這裡則可以直接省略,直接使用innerHTML = barHtml+barHtml;來代替
　　　　var newHtml = "<table border='0' cellspacing='0' cellpadding='0'>\n";
　　　　newHtml += "  <tr height='20'>\n";
　　　　newHtml += "  <td> \n";
　　　　newHtml += "  </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "</table>\n";
　　　　innerHTML = newHtml;
　　　　break;
　　　case "down":
　　　　maxValue = Math.max(scrollHeight, height);
　　　　style.overflowX = "visible";
　　　　style.overflowY = "hidden";
　　　　var barHtml = innerHTML;
　　　　var newHtml = "<table border='0' cellspacing='0' cellpadding='0'>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "</table>\n";
　　　　innerHTML = newHtml;
　　　　scrollTop = maxValue;
　　　　break;
　　　case "left":
　　　　maxValue = Math.max(scrollWidth, width);
　　　　style.overflowX = "hidden";
　　　　style.overflowY = "visible";
　　　　var barHtml = barID.innerHTML;
　　　　var newHtml = "<table border='0' cellspacing='0' cellpadding='0' width='" + (maxValue * 2 ) + "'>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td width='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "    <td width='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "</table>\n";
　　　　innerHTML = newHtml;
　　　　break;
　　　case "right":
　　　　maxValue = Math.max(scrollWidth, width);
　　　　style.overflowX = "hidden";
　　　　style.overflowY = "visible";
　　　　var barHtml = innerHTML;
　　　　var newHtml = "<table border='0' cellspacing='0' cellpadding='0' width='" + (maxValue * 2 ) + "'>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td width='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "    <td width='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "</table>\n";
　　　　innerHTML = newHtml;
　　　　scrollLeft = maxValue;
　　　　break;
　　　default:
　　　　//throw "direction is inccorect!";
　　　　alert("ScrollBar[" + id + "]: direction is incorect!");
　　　　return;
　　}
  
　　//set mouse events
　　onmouseover = new Function("__scrollBarControl.mouseEvt(" + index + ",true);");
　　onmouseout = new Function("__scrollBarControl.mouseEvt(" + index + ",false);");
　　if(__firstTime)
　　{
　　　__firstTime=false;
　　　window.setInterval("__scrollBarControl.scroll(" + index + ");",interval);
　　}
　　//save maxValue
　　this.barsArray[index].maxValue = maxValue;
　}
}
scrollBar.prototype.mouseEvt = function(index, stop)
{
　this.barsArray[index].stopScroll = stop;
}
scrollBar.prototype.scroll = function(index)
{
　//get properties
　var barID = this.barsArray[index].barID;
　var width = this.barsArray[index].width;
　var height = this.barsArray[index].height;
　var interval = this.barsArray[index].interval;
　var direction = this.barsArray[index].direction;
　var stopScroll = this.barsArray[index].stopScroll;
　var preValue = this.barsArray[index].preValue;
　var maxValue = this.barsArray[index].maxValue;
 
　if ( stopScroll == true ) return;
 
　switch(direction)
　{
　　case "up":
　　　preValue++;
　　　if ( preValue >= maxValue )
　　　{
　　　　preValue = 0;
　　　}
　　　barID.scrollTop = preValue;
　　　break;
　　case "down":
　　　preValue--;
　　　if ( preValue <= 0 )
　　　{
　　　　preValue = maxValue;
　　　}
　　　barID.scrollTop = preValue;
　　　break;
　　case "left":
　　　preValue++;
　　　if ( preValue >= maxValue )
　　　{
　　　　preValue = 0;
　　　}
　　　barID.scrollLeft = preValue;
　　　break;
　　case "right":
　　　preValue--;
　　　if ( preValue <=0 )
　　　{
　　　　preValue = maxValue;
　　　}
　　　barID.scrollLeft = preValue;
　　　break;
　}
　this.barsArray[index].preValue = preValue;
}
//=================end of file===========================
</SCRIPT>
<SCRIPT type="text/javascript">
//這裡是使用在網頁上的
var scrollBarControl = new scrollBar();
MoveTo("up");
function MoveTo(d)
{
　//清除剛才宣告的scrollbarcontrol
　scrollBarControl.clear();
　//新增一欲滾動的ID,五個參數分別為
　//欲滾動的區塊ID,寬,高,速度,方向
　scrollBarControl.addBar("scrollbarDemo", 228, 120, 100, d);
　scrollBarControl.createScrollBars();
}
</SCRIPT>


//這是要滾動的內容,最好用div包起來
<div id="scrollbarDemo">
這裡是要滾動的內容
</div>

<SCRIPT type="text/javascript">
//這一塊是主要程式運作的地方
var __scrollBarControl = null;
var __divinnerHTML=null;
var __firstTime=true;
function innerBarProp(barID, width, height, interval, direction)
{
　this.barID = barID;
　this.width = width;
　this.height = height;
　this.interval = interval;
　this.direction = direction;
　this.stopScroll = false;
　this.maxValue = 0;
　this.preValue = 0;
}
function scrollBar()
{
　this.barsArray = new Array();
　//save current object
　__scrollBarControl = this;
}
//////////////////////////////////////////////////////////////////
// add scrollbar to bar list and set properties
// parameters:
//     barID: HTML's tag <DIV>'s id property 
//              (for js access the DIV object)
//     width: define the scrollbar's width
//     height: define the scrollbar's height
//     interval: define the scroll speed 
//               ( scroll up/down per XX millinSecond )
//     direction: scroll direction's defined
//               "up"
//               "down"
//               "left"
//               "right"
//////////////////////////////////////////////////////////////////
scrollBar.prototype.addBar = function(barID, width, height, interval, direction)
{
　//check parameters
　var paraCount = arguments.length;
　if ( paraCount < 1 )
　{
　　alert("parameters count incorect!");
　　return;
　　//throw "parameters count inccorect!";
　}
 
　//width's default value
　if ( typeof( width ) == "undefined" )
　{
　　var width = 100;
　}
 
　//height's default value
　if ( typeof( height ) == "undefined" )
　{
　　var height = 100;
　}
 
　//interval's default value
　if ( typeof( interval ) == "undefined" )
　{
　　var interval = 1000;
　}
　
　//direction's default value
　if ( typeof( direction ) == "undefined" )
　{
　　var direction = "up";
　}
 
　//create scrollbar's inner properties
　var barProp = new innerBarProp(barID, width, height, interval, direction);
　var objBar = document.getElementById(barID);
　if(__divinnerHTML!=null)
　　objBar.innerHTML=__divinnerHTML;
　else
　　__divinnerHTML=objBar.innerHTML;
　var barCount = this.barsArray.length;
　this.barsArray[barCount] = barProp;
}
scrollBar.prototype.clear = function()
{
　for(i=0;i<this.barsArray.length;i++)
　　this.barsArray.pop();
}
scrollBar.prototype.createScrollBars = function()
{
　//get bar's count
　var barCount = this.barsArray.length;
　//if no bar add to scrollControl do nothing
　if ( barCount == 0 )
　{
　　return;
　}
 
　//init scroll bars
　for ( var i=0; i<barCount; i++ )
　{
　　var objBarID = this.barsArray[i].barID;
　　//if typeof objBarID is object
　　// that's meaning it inited
　　//if typeof objBarID is string
　　// init that scroll bar
　　if ( typeof( objBarID ) == "string" )
　　{
　　　//get scroll <DIV> object
　　　var objBar = document.getElementById( objBarID ); 
　　　if (objBar == null)
　　　{
　　　　//objBarID is not exist
　　　　if ( document.readyState == "complete" || document.readyState == "loaded" )
　　　　{
　　　　　//the objBarID not exists in current document
　　　　　//throw "the objBarID is not exists.";
　　　　　alert("ScrollBar[" + objBarID + "]: not exist!");
　　　　　return;
　　　　}
　　　　else
　　　　{
　　　　　//wait for document to load objBarID
　　　　　window.setTimeout("__scrollBarControl.createScrollBars()",50);
　　　　　//exit processing..........
　　　　　//and wait next time callbak
　　　　　return;
　　　　}
　　　}
　　　//update barID
　　　this.barsArray[i].barID = objBar;
　　}
　}
 
　for ( var i=0; i<barCount; i++ )
　{
　　this.innerInitBar(i);
　}
}
scrollBar.prototype.innerInitBar = function (index)
{ 
　//get properties
　var barID = this.barsArray[index].barID;
　var width = this.barsArray[index].width;
　var height = this.barsArray[index].height;
　var interval = this.barsArray[index].interval;
　var direction = this.barsArray[index].direction;
　var maxValue = 0;
 
　//set scrollBar's properties
　with(barID)
　{
　　style.width = width;
　　style.height = height;
　　noWrap=true;
　　switch( direction )
　　{
　　　//這裡是實際決定滾動方向及內容的地方
　　　//有up,down,left,right
　　　case "up":
　　　　maxValue = Math.max(scrollHeight, height);
　　　　style.overflowX = "visible";
　　　　style.overflowY = "hidden";
　　　　//宣告barHtml來放代入的div裡面的內容
　　　　var barHtml = innerHTML;
　　　　//將之複製二次,並擺在一個table裡面
　　　　//若外面傳入的div裡面的table己寫好
　　　　//這裡則可以直接省略,直接使用innerHTML = barHtml+barHtml;來代替
　　　　var newHtml = "<table border='0' cellspacing='0' cellpadding='0'>\n";
　　　　newHtml += "  <tr height='20'>\n";
　　　　newHtml += "  <td> \n";
　　　　newHtml += "  </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "</table>\n";
　　　　innerHTML = newHtml;
　　　　break;
　　　case "down":
　　　　maxValue = Math.max(scrollHeight, height);
　　　　style.overflowX = "visible";
　　　　style.overflowY = "hidden";
　　　　var barHtml = innerHTML;
　　　　var newHtml = "<table border='0' cellspacing='0' cellpadding='0'>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td height='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "</table>\n";
　　　　innerHTML = newHtml;
　　　　scrollTop = maxValue;
　　　　break;
　　　case "left":
　　　　maxValue = Math.max(scrollWidth, width);
　　　　style.overflowX = "hidden";
　　　　style.overflowY = "visible";
　　　　var barHtml = barID.innerHTML;
　　　　var newHtml = "<table border='0' cellspacing='0' cellpadding='0' width='" + (maxValue * 2 ) + "'>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td width='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "    <td width='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "</table>\n";
　　　　innerHTML = newHtml;
　　　　break;
　　　case "right":
　　　　maxValue = Math.max(scrollWidth, width);
　　　　style.overflowX = "hidden";
　　　　style.overflowY = "visible";
　　　　var barHtml = innerHTML;
　　　　var newHtml = "<table border='0' cellspacing='0' cellpadding='0' width='" + (maxValue * 2 ) + "'>\n";
　　　　newHtml += "  <tr>\n";
　　　　newHtml += "    <td width='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "    <td width='" + maxValue + "' valign='top'>\n";
　　　　newHtml += barHtml + "\n";
　　　　newHtml += "    </td>\n";
　　　　newHtml += "  </tr>\n";
　　　　newHtml += "</table>\n";
　　　　innerHTML = newHtml;
　　　　scrollLeft = maxValue;
　　　　break;
　　　default:
　　　　//throw "direction is inccorect!";
　　　　alert("ScrollBar[" + id + "]: direction is incorect!");
　　　　return;
　　}
  
　　//set mouse events
　　onmouseover = new Function("__scrollBarControl.mouseEvt(" + index + ",true);");
　　onmouseout = new Function("__scrollBarControl.mouseEvt(" + index + ",false);");
　　if(__firstTime)
　　{
　　　__firstTime=false;
　　　window.setInterval("__scrollBarControl.scroll(" + index + ");",interval);
　　}
　　//save maxValue
　　this.barsArray[index].maxValue = maxValue;
　}
}
scrollBar.prototype.mouseEvt = function(index, stop)
{
　this.barsArray[index].stopScroll = stop;
}
scrollBar.prototype.scroll = function(index)
{
　//get properties
　var barID = this.barsArray[index].barID;
　var width = this.barsArray[index].width;
　var height = this.barsArray[index].height;
　var interval = this.barsArray[index].interval;
　var direction = this.barsArray[index].direction;
　var stopScroll = this.barsArray[index].stopScroll;
　var preValue = this.barsArray[index].preValue;
　var maxValue = this.barsArray[index].maxValue;
 
　if ( stopScroll == true ) return;
 
　switch(direction)
　{
　　case "up":
　　　preValue++;
　　　if ( preValue >= maxValue )
　　　{
　　　　preValue = 0;
　　　}
　　　barID.scrollTop = preValue;
　　　break;
　　case "down":
　　　preValue--;
　　　if ( preValue <= 0 )
　　　{
　　　　preValue = maxValue;
　　　}
　　　barID.scrollTop = preValue;
　　　break;
　　case "left":
　　　preValue++;
　　　if ( preValue >= maxValue )
　　　{
　　　　preValue = 0;
　　　}
　　　barID.scrollLeft = preValue;
　　　break;
　　case "right":
　　　preValue--;
　　　if ( preValue <=0 )
　　　{
　　　　preValue = maxValue;
　　　}
　　　barID.scrollLeft = preValue;
　　　break;
　}
　this.barsArray[index].preValue = preValue;
}
//=================end of file===========================
</SCRIPT>
<SCRIPT type="text/javascript">
//這裡是使用在網頁上的
var scrollBarControl = new scrollBar();
MoveTo("up");
function MoveTo(d)
{
　//清除剛才宣告的scrollbarcontrol
　scrollBarControl.clear();
　//新增一欲滾動的ID,五個參數分別為
　//欲滾動的區塊ID,寬,高,速度,方向
　scrollBarControl.addBar("scrollbarDemo", 228, 120, 100, d);
　scrollBarControl.createScrollBars();
}
</SCRIPT>

2007年8月10日星期五

清除UTF-8檔的BOM檔頭

今天不小心用Notepad改了個檔案
結果...BOM檔頭就一直存在...拿不掉...
這個怪怪的Bug害我花了很多時間在測試~~
還好有幸看到石頭閒語的這篇文章...
PHP::關於 PHP 4/5 對 UTF-BOM 的 bug

另外有找到移除的小程式...就節錄下來了~~
原文出處:自動移除文件中的 utf-8 bom的小程式
將此檔案擺在根目錄執行便會自動檢查所有檔案....
並自動修正~

＜？php
//remove the utf-8 boms
//by magicbug at gmail dot com
if (isset($_GET[’dir’])){ //config the basedir
$basedir=$_GET[’dir’];
}else{
$basedir = ".";
}
$auto = 1;

checkdir($basedir);

function checkdir($basedir){
if ($dh = opendir($basedir)) {
while (($file = readdir($dh)) !== false) {
if ($file != "." && $file != ".."){
if (!is_dir($basedir."/".$file)) {
echo "filename: $basedir/$file ".checkBOM("$basedir/$file")."";
}else{
$dirname = $basedir."/".$file;
checkdir($dirname);
}
}
}
closedir($dh);
}
}

function checkBOM ($filename) {
global $auto;
$contents = file_get_contents($filename);
$charset[1] = substr($contents, 0, 1);
$charset[2] = substr($contents, 1, 1);
$charset[3] = substr($contents, 2, 1);
if (ord($charset[1]) == 239 && ord($charset[2]) == 187 && ord($charset[3]) == 191) {
if ($auto == 1) {
$rest = substr($contents, 3);
rewrite ($filename, $rest);
return ("BOM found, automatically removed.
");
} else {
return ("BOM found.
");
}
}
else return ("BOM Not Found.
");
}

function rewrite ($filename, $data) {
$filenum = fopen($filename, "w");
flock($filenum, LOCK_EX);
fwrite($filenum, $data);
fclose($filenum);
}
？＞

2007年6月4日星期一

[轉貼].htaccess檔製作

轉貼自網站建置百寶箱

.htaccess 檔是 apache http 伺服器上的一個設定檔。
一般來說，管理人員都會開放部份功能給你自行設定，也有的會完全關閉對 .htaccess 的支援。

設定網頁密碼；
設定發生錯誤時出現的文件；
改變首頁的檔案 (index.html)；
禁止讀取檔案；
重新導向文件；
加上 MIME 類別；
防止列出目綠內的檔案..等等一般常用功能
(其他進階功能則不在此談)

【.htaccess 簡介】
.htaccess 是一個文字檔，你可以做任何好像 notepad 的文字編輯器去寫一個。
或者你會對 .htaccess 這個名字有點困惑，其實 .htaccess 是一個完全的檔案名，不是 filaname.htaccess 或者甚麼的（當然也有管理員故意把它設定成其他名字，但一般都是用 .htaccess 的）。為何是 .htaccess？因為所有以 "." 開頭的檔名在 *nix 系統中也是有屬性隱藏的，平常列出資料夾時不會出現，所以保安會好一點。你可能會問：『MS Windows 要我一定給它一個名字，如何把它存檔成為 .htaccess？』其實方法有兩個。第一個是到 ms-dos 的視窗中，按 ren filename.xxx .htaccess 就可以了；第二個是在上傳到伺服器時才改名做 .htaccess。
而 .htaccss 內設定的格式是一行一個指令，如果你的 notepad 設定了自動換行的話，請關上它，這樣會比較安全。
一點要注意， .htaccess 是 apache 的產物，不是 IIS 的。IIS 伺服器不支援它，也就是說你不能以簡單地上傳一個 ASCII 檔去設定在 IIS 伺服器上的 http 服務。
在上載 .htaccess 時，必需使用 ASCII 模式！你或許還要 chmod 它到 644(RW_R__R_)。
每一個放了 .htaccess 的目錄和它的子目錄都會被 .htaccess 影響。如果我在 /abc/ 放了一個 .htaccess，那麼 /abc/ 和 /abc/def/ 內所有 file 都會被它影響，但 /index.html 不會被它影響 ←← 這一點是很重要的。

【密碼保護】

這是最常見 .htaccess 被使用的功能之一，資料夾密碼保護。
這種方法可以使沒有授權的瀏覽者不能進入你所設定的限制區域，使用了 Javacript 設的密碼太簡單了，一下字就會被破解，而使用 .htaccess 系統就比使用 CGI 程式保護會員專頁將更為有效，更安全。更重要的是使用 .htaccess 方式去設定不需要編寫程式的技能。
首先，你要開啟一般文字編輯工具，做出一個名叫 .htpasswd 的檔名(當然又可能是其他，但一般伺服器都會設定 .htpasswd 是不能經由 http 讀到的。檔案中的的每一句代表一個使用者，使用者名稱以及加密了的密碼是以冒號(分隔。而密碼必須經過加密才可以使用。加密的方法是一般密碼使用了的 crypt，如果你不知如何加密，請到以下的網頁。
UHome
http://www.euronet.nl/~arnow/htpasswd/

注: Win32 版本的 apache 好像不支援用了 crypt 加密法的密碼檔，只支援 SHA1 和 MD5 的。如果你是使用 apahce for win32 版本，請使用 appserv\apache\bin\htpasswd.exe 做出以 MD5 加密的密碼檔！！

再在 .htaccess 中，加上以下句子
AuthName MemberPage
AuthType Basic
AuthUserFile /absolute/path/.htpasswd
require valid-user

AuthName 就是當 browser 得知要密碼時所出現的句字，你可以自行改動 MemberPage；而第二句的 AuthType Basic 就千萬不要去改；第三句的 AuthUserFile 就是設定所使用的 .htpasswd 檔，要留意它好像必需是在伺服器上的絕對路徑。請留意，這不是 URL 的位置、也不一定是在 ftp 中看到的位置、就算是由 CGI 自行測到的路徑也未必準確，請細看伺服器上的說明 (例如在 virtualave.net，URL 是 /.htpasswd ftp 看到的是 /public_html/.htpasswd，CGI 測到 /home/public_html/.htpasswd，但是事實上你要設定路徑為 /data1/virtualave.net/USERNAME/public_html/.htpasswd)。
為了保安理由，不建議把 .htpasswd 放到可以用 http 讀到的目錄；
最後的 require 就是命令伺服器誰可以進入，require valid-user 就是指只要是 .htpasswd 中的任何一人就可了；你也可以指定在名單上只有某人可以通過，require user username 或 require user username1 username2 username3；也可以指定是某組人才可以，require group groupname。

而設定組的方法是再做一個叫 .htgroup 的文字檔，內容如下：
groupname1: username1 username2 username3
groupname2: username1 username3 username4

再在 .htaccess 中加多一句 AuthGroupFile /absolute/path/.htgroup
方法和加入 .htpasswd　的一樣。轉貼自網站建置百寶箱

.htaccess 檔是 apache http 伺服器上的一個設定檔。
一般來說，管理人員都會開放部份功能給你自行設定，也有的會完全關閉對 .htaccess 的支援。

設定網頁密碼；
設定發生錯誤時出現的文件；
改變首頁的檔案 (index.html)；
禁止讀取檔案；
重新導向文件；
加上 MIME 類別；
防止列出目綠內的檔案..等等一般常用功能
(其他進階功能則不在此談)

【.htaccess 簡介】
.htaccess 是一個文字檔，你可以做任何好像 notepad 的文字編輯器去寫一個。
或者你會對 .htaccess 這個名字有點困惑，其實 .htaccess 是一個完全的檔案名，不是 filaname.htaccess 或者甚麼的（當然也有管理員故意把它設定成其他名字，但一般都是用 .htaccess 的）。為何是 .htaccess？因為所有以 "." 開頭的檔名在 *nix 系統中也是有屬性隱藏的，平常列出資料夾時不會出現，所以保安會好一點。你可能會問：『MS Windows 要我一定給它一個名字，如何把它存檔成為 .htaccess？』其實方法有兩個。第一個是到 ms-dos 的視窗中，按 ren filename.xxx .htaccess 就可以了；第二個是在上傳到伺服器時才改名做 .htaccess。
而 .htaccss 內設定的格式是一行一個指令，如果你的 notepad 設定了自動換行的話，請關上它，這樣會比較安全。
一點要注意， .htaccess 是 apache 的產物，不是 IIS 的。IIS 伺服器不支援它，也就是說你不能以簡單地上傳一個 ASCII 檔去設定在 IIS 伺服器上的 http 服務。
在上載 .htaccess 時，必需使用 ASCII 模式！你或許還要 chmod 它到 644(RW_R__R_)。
每一個放了 .htaccess 的目錄和它的子目錄都會被 .htaccess 影響。如果我在 /abc/ 放了一個 .htaccess，那麼 /abc/ 和 /abc/def/ 內所有 file 都會被它影響，但 /index.html 不會被它影響 ←← 這一點是很重要的。

【密碼保護】

這是最常見 .htaccess 被使用的功能之一，資料夾密碼保護。
這種方法可以使沒有授權的瀏覽者不能進入你所設定的限制區域，使用了 Javacript 設的密碼太簡單了，一下字就會被破解，而使用 .htaccess 系統就比使用 CGI 程式保護會員專頁將更為有效，更安全。更重要的是使用 .htaccess 方式去設定不需要編寫程式的技能。
首先，你要開啟一般文字編輯工具，做出一個名叫 .htpasswd 的檔名(當然又可能是其他，但一般伺服器都會設定 .htpasswd 是不能經由 http 讀到的。檔案中的的每一句代表一個使用者，使用者名稱以及加密了的密碼是以冒號(分隔。而密碼必須經過加密才可以使用。加密的方法是一般密碼使用了的 crypt，如果你不知如何加密，請到以下的網頁。
UHome
http://www.euronet.nl/~arnow/htpasswd/

注: Win32 版本的 apache 好像不支援用了 crypt 加密法的密碼檔，只支援 SHA1 和 MD5 的。如果你是使用 apahce for win32 版本，請使用 appserv\apache\bin\htpasswd.exe 做出以 MD5 加密的密碼檔！！

再在 .htaccess 中，加上以下句子
AuthName MemberPage
AuthType Basic
AuthUserFile /absolute/path/.htpasswd
require valid-user

AuthName 就是當 browser 得知要密碼時所出現的句字，你可以自行改動 MemberPage；而第二句的 AuthType Basic 就千萬不要去改；第三句的 AuthUserFile 就是設定所使用的 .htpasswd 檔，要留意它好像必需是在伺服器上的絕對路徑。請留意，這不是 URL 的位置、也不一定是在 ftp 中看到的位置、就算是由 CGI 自行測到的路徑也未必準確，請細看伺服器上的說明 (例如在 virtualave.net，URL 是 /.htpasswd ftp 看到的是 /public_html/.htpasswd，CGI 測到 /home/public_html/.htpasswd，但是事實上你要設定路徑為 /data1/virtualave.net/USERNAME/public_html/.htpasswd)。
為了保安理由，不建議把 .htpasswd 放到可以用 http 讀到的目錄；
最後的 require 就是命令伺服器誰可以進入，require valid-user 就是指只要是 .htpasswd 中的任何一人就可了；你也可以指定在名單上只有某人可以通過，require user username 或 require user username1 username2 username3；也可以指定是某組人才可以，require group groupname。

而設定組的方法是再做一個叫 .htgroup 的文字檔，內容如下：
groupname1: username1 username2 username3
groupname2: username1 username3 username4

再在 .htaccess 中加多一句 AuthGroupFile /absolute/path/.htgroup
方法和加入 .htpasswd　的一樣。

2007年5月17日星期四

DIV 與 SPAN 的不同

原文轉錄：DIV 與 SPAN 標籤

HTML 中使用 CSS 來定義樣式、版面配置, 近年又重新回到主流.

說到使用 CSS 來作為網頁版面配置, 就不得不介紹一下 DIV 這個 Tag(標籤). 除了 DIV Tag, 順便也介紹一下 SPAN 標籤.

在網路上搜尋到一個蠻清楚的定義，可供參考如下，

The tag defines a division/section in a document.

Browsers usually place a line break before and after the div element.
Use the tag to group block-elements to format them with styles.

The tag is used to group inline-elements in a document.
Use the tag to group inline-elements to format them with styles

來源:www.w3schools.com

在 W3C 的定義中

DIV 是屬於 block-level(區塊) elements

SPAN 是 inline(行內，Text level) elements.

舉個簡單的例子，網頁中的文字內容就是屬於 inline(行內) elements。而 block-level(區塊) elements 則可以把文字、表格、圖層、影像檔案..等內容 Group 起來。例如一般文字或表格預設是向左靠齊，若使用 DIV 標籤將一個段落與表格 Group 起來成為一個 block，則改變 DIV 標籤的 Align(對齊)屬性為向右靠齊，該文字段落與表格都會同時變成向右靠齊。因為它們現在屬於同一個block (區塊)。

原文轉錄：DIV 與 SPAN 標籤

DIV 是屬於 block-level(區塊) elements

2007年4月3日星期二

滑鼠游標

工作需要，要在網頁更改游標的圖示．．．
剛巧找到這一頁教學，寫的蠻詳細的~

OECSPACE Cursor「滑鼠游標教學與下載」

節錄我所需用到程式部份

在IE瀏覽環境,W3C發佈網頁滑鼠游標的標準寫法說明:

<style type="text/css">

</style>

當無法處理游標名單的第一個游標,則會以第二個游標代替若無法處理任何定義的游標,最後便以一般游標text顯示

網頁游標其他標籤元素CSS,寫法為:

body {cursor:url("mything.cur"),text;} 整個網頁
table {cursor:url("mything.cur"),text;} 表格
input {cursor:url("mything.cur"),text;} 單行文字表單
a {cursor:url("mything.cur"),text;} 超連結

自由變更網頁游標

複製語法貼於<head></head>之間

<script type="text/javascript">

</script>

複製語法貼於body框框內

ID="myCursor"

複製語法貼於<body></body>之間

按下圖片改變滑鼠游標
<img border="0"
src="1.gif" onClick="changeCursor('cur_s1.ani')">
<img
border="0" src="2.gif" onClick="changeCursor('cur_s2.ani')">

<style type="text/css">

</style>

當無法處理游標名單的第一個游標,則會以第二個游標代替若無法處理任何定義的游標,最後便以一般游標text顯示

網頁游標其他標籤元素CSS,寫法為:

body {cursor:url("mything.cur"),text;} 整個網頁
table {cursor:url("mything.cur"),text;} 表格
input {cursor:url("mything.cur"),text;} 單行文字表單
a {cursor:url("mything.cur"),text;} 超連結

自由變更網頁游標

複製語法貼於<head></head>之間

<script type="text/javascript">

</script>

複製語法貼於body框框內

ID="myCursor"

複製語法貼於<body></body>之間

按下圖片改變滑鼠游標
<img border="0"
src="1.gif" onClick="changeCursor('cur_s1.ani')">
<img
border="0" src="2.gif" onClick="changeCursor('cur_s2.ani')">

訂閱：文章 (Atom)

小小工程師的生活雜記

2010年3月22日星期一

在javascript中抓取陣列資料

2008年8月14日星期四

HTML字符編碼大全

2008年3月28日星期五

php的strpos 以及 javascript的indexOf()

2008年3月14日星期五

2008年3月4日星期二

Javascript Event 座標

2007年10月2日星期二

Apache 檔案上傳限制設定

2007年8月23日星期四

無間斷圖片跑馬燈

2007年8月10日星期五

清除UTF-8檔的BOM檔頭

2007年6月4日星期一

[轉貼].htaccess檔製作

2007年5月17日星期四

DIV 與 SPAN 的不同

2007年4月3日星期二

滑鼠游標

好康推薦

文章分類

封存文章

跟我聯絡

2010年3月22日 星期一

2008年8月14日 星期四

2008年3月28日 星期五

2008年3月14日 星期五

2008年3月4日 星期二

2007年10月2日 星期二

2007年8月23日 星期四

2007年8月10日 星期五

2007年6月4日 星期一

2007年5月17日 星期四

2007年4月3日 星期二

好康推薦

文章分類

封存文章

跟我聯絡

2010年3月22日星期一

2008年8月14日星期四

2008年3月28日星期五

2008年3月14日星期五

2008年3月4日星期二

2007年10月2日星期二

2007年8月23日星期四

2007年8月10日星期五

2007年6月4日星期一

2007年5月17日星期四

2007年4月3日星期二