41 Web developers must have a collection of JavaScript practical tips

1. The right mouse button will be completely shielded

oncontextmenu= "Window.event.returnvalue=false" < table border Oncontextmenu=return (false) >< td>no</ Table> can be used for Table

2. Deselect, prevent copying

< body onselectstart= "return false" >

3.JS Paste not allowed

Onpaste= "return False"

4. js to prevent copying

Oncopy= "return false;" oncut= "return false;"

5. Switch to your own icon before the IE address bar

< link rel= "Shortcut Icon" href= "Favicon.ico" >

Put this image in the root directory of the file, and the suffix will be modified to ICO.

6. You can display your icon in the Favorites folder

< link rel= "Bookmark" href= "Favicon.ico" >

7. Turn off IME

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

8. Always with frame

< script language= "JavaScript" ><!–if (window = = top) Top.location.href = "frames.htm"; Frames.htm for frames page//–></script>

9. Prevent people from being frame

< SCRIPT language=javascript><!–if (top.location! = self.location) top.location=self.location;//–></ Script>

10. Web pages will not be saved as

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

One. < input Type=button value= View Web page source code

onclick= "window.location =" View-source: "+" http://www.pconline.com.cn "" >

12. Confirm when deleting

< a href= "javascript:if (Confirm (" Do you want to delete it? ")) location= "boos.asp?&areyou= Delete &page=1″" > Delete </a>

13. Get the absolute position of the control

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,bset a= Document.all.img1t=document.all.img1.offsettopl=document.all.img1.offsetleftwhile a.tagName< > "BODY" Set a = A.offsetparentt=t+a.offsettopl=l+a.offsetleftwendmsgbox "top=" &T&CHR (& "left=" &l,64, "get control position" End function–></script>

14. The cursor is stopped at the end of text in the textbox

< 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. Determine the origin of the previous page

Javascript:document.referrer

16. Minimize, maximize, close the window

< 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= minimized onclick=hh1. Click () >< input Type=button value= maximize ONCLICK=HH2. Click () >< input Type=button value= close onclick=hh3. Click () >

This example applies to IE

17. Shielding function Key Shift,alt,ctrl

< script>function look () {if (Event.shiftkey) alert ("Do not press the Shift key!");//Can be replaced by ALT ctrl}document.onkeydown=look;</ Script>

18. Web pages are not cached

< meta http-equiv= "Pragma" content= "No-cache" >< meta http-equiv= "Cache-control" content= "No-cache, Must-revalidate ">< META http-equiv=" Expires "content=" Wed, 1997 08:21:57 GMT "> or < META http-equiv=" Expires "content=" 0″>

19. How do I make the form feel less bump?

< input type=text style= "border:1 solid #000000 ″> or < input type=text style=" border-left:none; Border-right:none; Border-top:none; Border-bottom:1 Solid #000000 ″></textarea>

20.< div>< span>&< layer> the difference?

< div> (division) is used to define a large segment of the page element, will generate a career change < span> used to define the elements within the same line, and < div> the only difference is not to generate a career change < layer> is the NS mark, IE does not support , equivalent to < div>

21. Make the pop-up window always on top:

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

22. Do not scroll bars?

Let the vertical bar not:

< body style= "Overflow:scroll;overflow-y:hidden" ></body>

Let the bars not:

< body style= "Overflow:scroll;overflow-x:hidden" ></body>

Two of them all removed? More simple.

< body scroll= "no" ></body>

23. How do I remove the dotted line around the image when I click the image link?

< a href= "#" onfocus= "This.blur ()" >< img src= "logo.jpg" border=0></a>

24. Email Processing Submission Form

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

25. How do I write in the code that refreshes the parent window of the Open child window?

Window.opener.location.reload ()

26. How to set the size of the open page

< body onload= "Top.resizeto (300,200);" > Open Page Location < body onload= "Top.moveby (300,200);" >

27. How to add a background image that is not full on the page, the background image does not move when pulling the page

< style>body{background-image:none; Background-repeat:no-repeat;background-position:center; background-attachment:fixed}</style>

28. Check to see if a string is all made up of numbers

< script language= "Javascript" ><!–function checknum (str) {return Str.match (//d/) ==null}alert (Checknum (" 1232142141 ") Alert (Checknum (" 123214214A1 "))//–></script>

29. Get the size of a window

Document.body.clientWidth; Document.body.clientHeight

30. How to determine if it is a character

if (/[^/x00-/xff]/g.test (s)) alert ("contains kanji"), Else alert ("All characters");

31.TEXTAREA Adaptive number of lines of text

< textarea Rows=1 name=s1 cols=27 onpropertychange= "This.style.posheight=this.scrollheight" ></textarea>

32. Date minus number of days equals second date

< script language=javascript>function cc (DD,DADD) {//can be added with error handling var a = new Date (dd) a = a.valueof () A = A–dadd * 24 * 6 0 * 1000a = new Date (a) alert (a.getfullyear () + "year" + (A.getmonth () + 1) + "month" + a.getdate () + "Day")}cc ("12/23/2002", 2) </script>

33. Which Radio are selected

< html>< script language= "VBScript" >function Checkme () for each OB in radio1if ob.checked then Window.alert ob. Valuenextend 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>
34. Scripts never go wrong
< SCRIPT language= "JavaScript" ><!–hidefunction killerrors () {return true;} Window.onerror = killerrors;//–></script>
The ENTER key allows you to move the cursor to the next input box
< input onkeydown= "if (event.keycode==13) event.keycode=9″>
36. Detect the link speed of a website:
Add the following code to the < body> area:
< script language=javascript>tim=1setinterval ("tim++", +) B=1var 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= Test ......> =" < inputtype= Textname=url "+i+" size=40> = "< input Type=button Value=goonclick=window.open (this.form.url" +i+ ". Value) >") document.write ("< input type=submit value= refresh ></form>")}butt () function Auto (URL) {document.forms[0]["url "+b].value=urlif (tim>200) {document.forms[0][" txt "+b].value=" link timeout "}else{document.forms[0][" txt "+b].value=" time "+tim/10+" Seconds "}b++}function run () {for (var i=1;i< autourl.length;i++) document.write (" < imgsrc=http://"+autourl+ "/" +math.random () + "width=1 Height=1onerror=auto (" http://"+autourl+") > ")}run () </script> 
37. Various styles of cursors
Auto: Standard cursor
Default: Standard arrow
Hand: Hand Cursor
Wait: Waiting cursor
Text:i-shaped cursor
Vertical-text: Horizontal I-shaped cursor
No-drop: Cannot drag cursor
Not-allowed: Invalid cursor
Help:? Aid cursor
All-scroll: Triangle Direction mark
Move: Moving the label
Crosshair: Cross-label
E-resize
N-resize
Nw-resize
W-resize
S-resize
Se-resize
Sw-resize
38. Page entry and exit effects
Go to page < meta http-equiv= "Page-enter" content= "Revealtrans (duration=x, transition=y)" >
Launch page < meta http-equiv= "Page-exit" content= "Revealtrans (duration=x, transition=y)" >
Here are some special effects when the page is loaded and paged out. Duration indicates the duration of the effect, in seconds.
Transition indicates which effect to use and the value is
1-23:
0 Rectangle reduction
1 Rectangle Enlargement
2 Round Zoom Out
3 Circular Enlargement
4 down to top refresh
5 Top to bottom refresh
6 Left to right refresh
7 right-to-left refresh
8 Vertical Blinds
9 Horizontal Blinds
10 Dislocation Horizontal Blinds
11 Dislocation Vertical Blinds
12-point diffusion
13 or so to the middle refresh
14 Middle to left and right refresh
15 middle to upper and lower
16 up and down to the middle
17 right down to top left
18 top right to bottom left
19 top left to bottom right
20 lower left to top right
21 Horizontal Bar
22 Vertical Bar
23 or more 22 random selection of a
39. Jump within the specified time
< META http-equiv=v= "REFRESH" content= "5; Url=http://www.51js.com ">
40. Whether the webpage is retrieved
< meta name= "ROBOTS" content= "Property values" >
There are some of the following property values:
The property value is "All": The file will be retrieved and the link on the page can be queried;
The property value is "None": The file is not retrieved and the link on the page is not queried;
The property value is "index": The file will be retrieved;
The property value is "Follow": the link on the query page;
The property value is "Noindex": The file is not retrieved but can be queried for links;
The property value is "nofollow": The file is not retrieved, but the link on the page can be queried.
41. Enter
Add the document's onkeydown event to the page with client script, and let the page tab after accepting the Enter event
The function of the key, which is to change the keycode of the event from 13 to 9
The Javascript code is as follows:
<script language= "javascript" for= "document" event= "onkeydown" ><!–if (event.keycode==13) event.keycode=9;– ></script>
This way, the focus can be moved down, but for the button also play the same role, the general customer after the input
Data, after jumping to the button, it is better to press "enter" to submit the data. So, for the above method
Modify, you should not focus on the submit button. Instead, the commit is activated directly.
So I made a change to the above code, that is, to determine the "source" of the event, whether it is a submit button, the code is as follows:
<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>
Determine if it is a button because there will be type= "button" on the HTML
Determine if it is a submit, because there will be type= "submit" on the HTML
Determine if reset is the result of the "reset" on the HTML that should be executed
The decision is null, because the "<a> link" on the HTML should also be executed, this situation does not occur much, you can use the "Tabindex=-1″ way to unlink the focus."
41 Web developers must have a collection of JavaScript practical tips