41個JS 小技巧超級實用

1. 將完全屏蔽鼠標右鍵

oncontextmenu=」window.event.returnValue=false」
< table border oncontextmenu=return(false)>< td>no< /table> 可用於 Table

2. 取消選取、防止複製

< body onselectstart=」return false」>

3.JS不容許粘貼

onpaste=」return false」

4. JS防止複製

oncopy=」return false;」 oncut=」return false;」

5. IE 地址欄前換成本身的圖標

< link rel=」Shortcut Icon」 href=」favicon.ico」>

在文件的根目錄放進去這個圖片，後綴修改爲ico就能夠了

6.能夠在收藏夾中顯示出你的圖標

< link rel=」Bookmark」 href=」favicon.ico」>

7.關閉輸入法

< input style=」ime-mode:disabled」>

8. 永遠都會帶着框架

< script language=」JavaScript」>< !–
if (window == top)top.location.href = 「frames.htm」; //frames.htm 爲框架網頁
// –>< /script>

9. 防止被人 frame

< SCRIPT LANGUAGE=JAVASCRIPT>< !–
if (top.location != self.location)top.location=self.location;
// –>< /SCRIPT>

10. 網頁將不能被另存爲

< noscript>< iframe src=*.html>< /iframe>< /noscript>

11. < input type=button value=查看網頁源代碼

onclick=」window.location = 「view-source:」+ 「http://www.pconline.com.cn」」>

12.刪除時確認

< a href=」javascript:if(confirm(」 確 實 要 刪 除 嗎 ?」))location=」boos.asp?&areyou= 刪 除
&page=1″」>刪除< /a>

13. 取得控件的絕對位置

//Javascript
< script language=」Javascript」>
function getIE(e){
var t=e.offsetTop;
var l=e.offsetLeft;
while(e=e.offsetParent){
t+=e.offsetTop;
l+=e.offsetLeft;
}
alert(「top=」+t+」/nleft=」+l);
}
< /script>
//VBScript
< script language=」VBScript」>< !–
function getIE()
dim t,l,a,b
set a=document.all.img1
t=document.all.img1.offsetTop
l=document.all.img1.offsetLeft
while a.tagName< >」BODY」
set a = a.offsetParent
t=t+a.offsetTop
l=l+a.offsetLeft
wend
msgbox 「top=」&t&chr(13)&」left=」&l,64,」獲得控件的位置」
end function
–>< /script>

14. 光標是停在文本框文字的最後

< script language=」javascript」>

function cc()
{
var e = event.srcElement;
var r =e.createTextRange();
r.moveStart(「character」,e.value.length);
r.collapse(true);
r.select();
}
< /script>
< input type=text name=text1 value=」123″ onfocus=」cc()」>

15. 判斷上一頁的來源

javascript:
document.referrer

16. 最小化、最大化、關閉窗口

< object id=hh1 classid=」clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11″>
< param name=」Command」 value=」Minimize」>< /object>
< object id=hh2 classid=」clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11″>
< param name=」Command」 value=」Maximize」>< /object>
< OBJECT id=hh3 classid=」clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11″>
< PARAM NAME=」Command」 VALUE=」Close」>< /OBJECT>
< input type=button value=最小化 onclick=hh1.Click()>
< input type=button value=最大化 onclick=hh2.Click()>
< input type=button value=關閉 onclick=hh3.Click()>
本例適用於 IE

17.屏蔽功能鍵 Shift,Alt,Ctrl

< script>
function look(){
if(event.shiftKey)
alert(「禁止按 Shift 鍵!」); //能夠換成 ALT CTRL
}
document.onkeydown=look;
< /script>

18. 網頁不會被緩存

< META HTTP-EQUIV=」pragma」 CONTENT=」no-cache」>
< META HTTP-EQUIV=」Cache-Control」 CONTENT=」no-cache, must-revalidate」>
< META HTTP-EQUIV=」expires」 CONTENT=」Wed, 26 Feb 1997 08:21:57 GMT」>
或者< META HTTP-EQUIV=」expires」 CONTENT=」0″>

19.怎樣讓表單沒有凹凸感？

< input type=text style=」border:1 solid #000000″>
或
< input type=text style=」border-left:none; border-right:none; border-top:none; border-bottom:
1 solid #000000″>< /textarea>

20.< div>< span>&< layer>的區別？

< div>(division)用來定義大段的頁面元素，會產生轉行
< span>用來定義同一行內的元素，跟< div>的惟一區別是不產生轉行
< layer>是 ns 的標記，ie 不支持，至關於< div>

21.讓彈出窗口老是在最上面:

< body onblur=」this.focus();」>

22.不要滾動條?

讓豎條沒有:
< body style=」overflow:scroll;overflow-y:hidden」>
< /body>
讓橫條沒有:
< body style=」overflow:scroll;overflow-x:hidden」>
< /body>
兩個都去掉？更簡單了
< body scroll=」no」>
< /body>

23.怎樣去掉圖片連接點擊後，圖片周圍的虛線？

< a href=」#」 onFocus=」this.blur()」>< img src=」logo.jpg」 border=0>< /a>

24.電子郵件處理提交表單

< form name=」form1″ method=」post」 action=」mailto:****@***.com」 enctype=」text/plain」>
< input type=submit>
< /form>

25.在打開的子窗口刷新父窗口的代碼裏如何寫？

window.opener.location.reload()

26.如何設定打開頁面的大小

< body onload=」top.resizeTo(300,200);」>
打開頁面的位置< body onload=」top.moveBy(300,200);」>

27.在頁面中如何加入不是滿鋪的背景圖片,拉動頁面時背景圖不動

< STYLE>
body
{background-image:url(logo.gif); background-repeat:no-repeat;
background-position:center;background-attachment: fixed}
< /STYLE>

28. 檢查一段字符串是否全由數字組成

< script language=」Javascript」>< !–
function checkNum(str){return str.match(//D/)==null}
alert(checkNum(「1232142141」))
alert(checkNum(「123214214a1」))
// –>< /script>

29. 得到一個窗口的大小

document.body.clientWidth; document.body.clientHeight

30. 怎麼判斷是不是字符

if (/[^/x00-/xff]/g.test(s)) alert(「含有漢字」);
else alert(「全是字符」);

31.TEXTAREA 自適應文字行數的多少

< textarea rows=1 name=s1 cols=27 onpropertychange=」this.style.posHeight=this.scrollHeight」>
< /textarea>

32. 日期減去天數等於第二個日期

< script language=Javascript>
function cc(dd,dadd)
{
//能夠加上錯誤處理
var a = new Date(dd)
a = a.valueOf()
a = a – dadd * 24 * 60 * 60 * 1000
a = new Date(a)
alert(a.getFullYear() + 「年」 + (a.getMonth() + 1) + 「月」 + a.getDate() + 「日」)
}
cc(「12/23/2002」,2)
< /script>

33. 選擇了哪個 Radio

< HTML>< script language=」vbscript」>
function checkme()
for each ob in radio1
if ob.checked then window.alert ob.value
next
end function
< /script>< BODY>
< INPUT name=」radio1″ type=」radio」 value=」style」 checked>Style
< INPUT name=」radio1″ type=」radio」 value=」barcode」>Barcode
< INPUT type=」button」 value=」check」 onclick=」checkme()」>
< /BODY>< /HTML>

34.腳本永不出錯

< SCRIPT LANGUAGE=」JavaScript」>
< !– Hide
function killErrors() {
return true;
}
window.onerror = killErrors;
// –>
< /SCRIPT>

35.ENTER 鍵可讓光標移到下一個輸入框

< input onkeydown=」if(event.keyCode==13)event.keyCode=9″>

36. 檢測某個網站的連接速度：

把以下代碼加入< body>區域中:
< script language=Javascript>
tim=1
setInterval(「tim++」,100)
b=1
var autourl=new Array()
autourl[1]=」www.njcatv.net」
autourl[2]=」javacool.3322.net」
autourl[3]=」www.sina.com.cn」
autourl[4]=」www.nuaa.edu.cn」
autourl[5]=」www.cctv.com」
function butt(){
document.write(「< form name=autof>」)
for(var i=1;i< autourl.length;i++)
document.write(「< input type=text name=txt」+i+」 size=10 value=測試中……> =》< input
type=text
name=url」+i+」 size=40> =》< input type=button value=GO
onclick=window.open(this.form.url」+i+」.value)>
「)
document.write(「< input type=submit value=刷新>< /form>」)
}
butt()
function auto(url){
document.forms[0][「url」+b].value=url
if(tim>200)
{document.forms[0][「txt」+b].value=」連接超時」}
else
{document.forms[0][「txt」+b].value=」時間」+tim/10+」秒」}
b++
}
function run(){for(var i=1;i< autourl.length;i++)document.write(「< img
src=http://」+autourl+」/」+Math.random()+」
width=1 height=1
onerror=auto(「http://」+autourl+」」)>」)}
run()< /script>

37. 各類樣式的光標

auto ：標準光標
default ：標準箭頭
hand ：手形光標
wait ：等待光標
text ：I 形光標
vertical-text ：水平 I 形光標
no-drop ：不可拖動光標
not-allowed ：無效光標
help ：?幫助光標
all-scroll ：三角方向標
move ：移動標
crosshair ：十字標
e-resize
n-resize
nw-resize
w-resize
s-resize
se-resize
sw-resize

38.頁面進入和退出的特效

進入頁面< meta http-equiv=」Page-Enter」 content=」revealTrans(duration=x, transition=y)」>
推出頁面< meta http-equiv=」Page-Exit」 content=」revealTrans(duration=x, transition=y)」>
這個是頁面被載入和調出時的一些特效。duration 表示特效的持續時間，以秒爲單位。
transition 表示使用哪一種特效，取值爲
1-23:
0 矩形縮小
1 矩形擴大
2 圓形縮小
3 圓形擴大
4 下到上刷新
5 上到下刷新
6 左到右刷新
7 右到左刷新
8 豎百葉窗
9 橫百葉窗
10 錯位橫百葉窗
11 錯位豎百葉窗
12 點擴散
13 左右到中間刷新
14 中間到左右刷新
15 中間到上下
16 上下到中間
17 右下到左上
18 右上到左下
19 左上到右下
20 左下到右上
21 橫條
22 豎條
23 以上 22 種隨機選擇一種

39.在規定時間內跳轉

< META http-equiv=V=」REFRESH」 content=」5;URL=http://www.51js.com」>

40.網頁是否被檢索

< meta name=」ROBOTS」 content=」屬性值」>
其中屬性值有如下一些:
屬性值爲」all」: 文件將被檢索，且頁上連接可被查詢；
屬性值爲」none」: 文件不被檢索，並且不查詢頁上的連接；
屬性值爲」index」: 文件將被檢索；
屬性值爲」follow」: 查詢頁上的連接；
屬性值爲」noindex」: 文件不檢索，但可被查詢連接；
屬性值爲」nofollow」: 文件不被檢索，但可查詢頁上的連接。

41.回車

用客戶端腳本在頁面添加document 的onkeydown事件,讓頁面在接受到回車事件後,進行Tab
鍵的功能,即只要把 event 的 keyCode 由 13 變爲 9
Javascript 代碼以下:
<script language=」javascript」 for=」document」 event=」onkeydown」>
<!–
if(event.keyCode==13)
event.keyCode=9;
–>
</script>
這樣的處理方式,能夠實現焦點往下移動,但對於按鈕也起一樣的做用,通常的客戶在輸入完
資料之後,跳到按鈕後,最好能直接按」回車」進行數據的提交.所以,對上面的方法要進行一下
修改,應該對於」提交」按鈕不進行焦點轉移.而直接激活提交.
所以我對上面的代碼進行了一個修改,即判斷事件的」源」,是否爲提交按鈕,代碼以下:
<script language=」javascript」 for=」document」 event=」onkeydown」>
<!–
if(event.keyCode==13 && event.srcElement.type!=’button’ &&
event.srcElement.type!=’submit’ && event.srcElement.type!=’reset’ &&
event.srcElement.type!=’textarea’ && event.srcElement.type!=」)
event.keyCode=9;
–>
</script>
判斷是否爲 button, 是由於在 HTML 上會有 type=」button」
判斷是否爲 submit,是由於 HTML 上會有 type=」submit」
判斷是否爲 reset,是由於 HTML 上的」重置」應該要被執行
判斷是否爲空,是由於對於 HTML 上的」<a>連接」也應該被執行,這種狀況發生的狀況很少,可
以使用」tabindex=-1″的方式來取消連接得到焦點.

• 本文固定連接: www.phpxs.com/post/5056/
• 轉載請註明：轉載必須在正文中標註並保留原文連接