虎搞瞎搞

1.表單運用跨視窗傳遞資料

藉由另一個視窗將資料傳回表單並自動關閉視窗

最想學的語言 查詢 

<form name="form1" action=""> 

<input type="text" name="fruit"> 

<a href="#" >option</a> 

</form>

製作查詢頁面的下拉式選單(另存一個網頁s.html)

<script type="text/javascript"> 

function choice() { 

sel = document.forms[0].elements[0]; 

opener.document.form1.fruit.value = 

sel.options[sel.selectedIndex].text; 

self.close(); 

} 

</script> 

<form><select > 

<option>select</option> 

<option>Korean</option> 

<option>Japanese</option> 

<option>French</option> 

</select></form> 

自行修改選擇的主題與項目

2.防止按鈕重複送出內容

我們使用一些程式例如送信.發表留言等..若程式內沒有禁止重複內容的功能,有些主機執行速度比較慢,遇到急性子的訪客可能會多按幾次送出按鈕,而造成重複發信或相同的留言內容,我們可以使用這個JS來防止這樣的情形.

<script type="text/javascript"> 

<!-- // 

function submitform() { 

document.formname.button.disabled = true; 

submitform = disableButton; 

document.formname.submit(); 

return false; 

} 

function disableButton() { 

alert('In processing'); 

return false; 

} 

// --> 

</script> 

<form name="formname" action="xxx.cgi" method="post"> 

<button name="button" >SUBMIT</button> 

</form>

3.實現內置框架高度自動調整

一般內置框架都是固定高度的,內容太長則會顯示捲軸,若將捲軸屬性設為 scrolling="no" ,不會出現捲軸但是過長的內容會被截斷,這教學利用javascript來實現動態調整,不顯示捲軸,可以依內容的長短自動調整高度,看起來就像網頁的一部分,而且這javascript可相容IE/NS/Firefox瀏覽器。

下載JS檔案 放置於網頁目錄下

<script type="text/javascript" src="iframe.js"></script> <iframe id="myTestFrameID" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" src="home.html" width="100%" height="300"></iframe> home.html 是內置框架中的網頁

請使用內部連結例如../home.html

用http://的連結方式無法正常顯示

4.表單自動全選的技巧

很多人習慣將要提供複製的內容或語法等..放在多行文字表單

有時候文字太長要反白文字再複製,好像又有那麼一點點麻煩,

自動全選不是更好.

自動全選

複製語法貼於表單標籤框框內

按一下全選

複製語法貼於表單標籤框框內

多行<textarea rows="7" name="s1" cols="60" 語法放這裡>

單行<input type="text" name="t1" size="15" 語法放這裡>

5.網頁保護之非法連結

你的網頁曾經遭他人盜用連結嗎?自己辛苦的成果例如教學或遊戲等...讓他人佔為己有流量大增,是不是一件很嘔的事?這篇教學使用JS來防止盜連

<script type="text/javascript"> 

<!-- 

var who=document.referrer; 

if(who && who.indexOf("www.hsiu28.net") == -1){ 

alert("Illegl Link . Copyright oecspace.com"); 

top.location.href = "http://www.hsiu28.net/"; 

} 

//--> 

</script> 

▼if(who && who.indexOf("www.hsiu28.net") == -1)

這裡是設定只有這個網址可以連結到這個網頁(不要使用轉址)

意思就是只有這個空間的連結才是有效的 

▼alert("Illegl link . Copyright oecspace.com "); 

設定非法連結的警告訊息

▼top.location.href = "http://www.hsiu28.net/"; 

設定非法連結後會跳至哪個網頁(最好設為你的首頁)

6.同時開啟兩個框架內容

一般連結通常都只有指定一個框架內顯示內容

這語法可以讓一個連結開啟兩個網頁在不同的框架內

<script type="text/javascript"> 

<!-- 

function load(p1,p2) { 

parent.main1.location.href=p1; 

parent.main2.location.href=p2; 

} 

//--> 

</script> 

<a href="javascript:load('home.htm','home2.htm')" >LINK</a> main1和main2是指框架名稱

7.上頁下頁重新整理

<a href="javascript:history.back()">BACK</a> 

<a href="javascript:history.forward()">NEXT</a> 

<a href="javascript:window.location.reload()">Reload</a>

8.錯誤圖檔的替代圖

在網路上常常看到圖片顯示不出來的情形,尤其是連結他站的LOGO，這樣的情形就破壞整個版面的美觀,這裡教你如何使用代替圖檔，讓無法顯示的圖轉為你所設定的圖片來顯示<script type="text/javascript"> 

var rimg = "logo.gif"; 

function errorimg(x, y) { 

if (y == null) { 

x.src = rimg; 

} 

else { 

x.src = y; 

} 

} 

</script> 

在你網頁內的圖檔標籤內加上 no4.gif" > 步驟一的var rImg = "logo.gif"就是設定替代圖檔

9.偵測解析度進入不同網頁

自動辨識瀏覽者解析度而進入不同的網頁<script type="text/javascript"> 

<!-- 

var swidth=1024; 

var sheight=768; 

if (screen.width<swidth||screen.height<sheight) 

{location.replace("800.htm");} 

else{location.replace("1024.htm");} 

//--> 

</script> 

800.htm和1024.htm就是自動辨識解析度進入的網頁

10.直接執行指定網頁(轉址)

設定進入此頁直接執行另一個網頁，就像轉址<script type="text/javascript"> 

if(top.usrID == null) { 

location = "home.html" 

} 

</script> 

home.html改為你要指定轉向的網址

11.防止網頁顯示在框架

每個網站大部分都有LINK連結區，集合了網路上的好站或朋友的網站介紹，當然網站製作人都很歡迎你介紹，但是沒有人希望自己的網站是被連結在你網頁的框架中，開個新視窗連結他人的網站是一種禮貌喔！但是總有一些網路新鮮人不小心把你的網站連到他的框架，這時候你就只有自己做好防護措施，使用下方這個程式的網頁就不能放在框架裡了喔！〈適合首頁使用〉<script type="text/javascript"> 

<!-- 

if(self != top) top.location.href =window.location.href; 

//--> 

</script>

12.預先讀取圖片的方法

在網頁頁面開啟之前先讓瀏覽器讀取預定的圖片<script type="text/javascript"> 

<!-- 

Image1= new Image(100,50) 

Image1.src = "img1.gif" 

Image2 = new Image(100,50) 

Image2.src = "img2.gif" 

// --> 

</script>

13.固定視窗大小

只要進入這網頁視窗就會自動顯示設定值的大小<script type="text/javascript"> 

function changesize(){ 

window.resizeTo(430,300); 

} 

window.onload=changesize; 

window.onresize=changesize; 

</script> 

(430,300)視窗寬.高

14.顯示在最上層的視窗

開多個視窗時.這視窗永遠顯示在每個視窗的最前面。<script type="text/javascript"> 

<!-- 

function floating(){ 

self.window.focus(); 

setTimeout("floating()",100); 

} 

setTimeout("floating()",100); 

// --> 

</script>

15.隨不同解析度最大化瀏覽器視窗

填滿是指瀏覽器視窗,並非網頁內容<script type="text/javascript"> 

<!-- 

self.moveTo(0,0) 

self.resizeTo(screen.availWidth,screen.availHeight) 

// --> 

</script>

16.瀏覽器中封鎖滑鼠右鍵

這是一個不能反白網頁內容的封鎖右鍵語法,也不會跳出右鍵功能,

但對於網頁防護並不是絕對,還是可以就由其他方式取得網頁內容,

不要過度使用而造成訪客的不便.

複製以下語法貼於body框框中

<body 語法貼這裡>

17.讓網址列網址不改變

一般我們首頁的名稱都要命名為index.htm或index.html,經由網址例如:

http://www.hsiu28.net/index.html

就不需要檔名直接用

http://www.hsiu28.net/

就能夠自動執行index.html這個檔案,所以我們將首頁index.html做成框架頁

讓所有網站內容都在這個框架中執行,網址就可以一直不變

複製以下語法存為index.html

<html><head> 

<meta http-equiv="Content-Type" c> 

<title>web title</title> 

</head> 

<frameset framespacing="0" border="0" rows="*" frameborder="0"> 

<frame name="main" src="home.html" scrolling="auto"> 

<noframes> 

<body> 

</body> 

</noframes> 

</frameset> 

</html> 

範例中home.html改為你要做為首頁畫面的網頁

18.防止網頁被另存html

藉由IE工具列上的另存新檔就可以將網頁存到電腦

這語法可以避免網頁在IE瀏覽器被另存新檔<noscript><iframe src=*.html></iframe></noscript>

19.link之網站的專屬圖示

favicon.ico 就是圖示檔名

製作圖示建議把圖示畫大一點,能填滿32x32的格式

參考:http://myaudition2005.mysinablog.com/index.php?op=ViewArticle&articleId=1448761

<link rel="shortcut icon" href="http://www.hsiu28.net/favicon.ico">