Home > Developer > JavaScript
1. text Box focus problem onBlur: this event is generated when the input focus is lost. onFocus: when the input gets the focus, the Onchange file is generated. When the text value changes, the Onselect event is generated: when the text is highlighted, the file <input type = "text" value = "mm" onfocus = "if (value = 'Mm) is generated) {value = ''}" onblur = "if (value ='') {value = 'mm'} "> when you click it, the text disappears. when the focus is lost, the text appears again.
2. special color of webpage buttons <input type = button name = "Submit1" value = "Guo Qiang" size = 10 class = s02style = "background-color: rgb (235,207, 22)">
3. color variation when moving the mouse in or out <input type = "submit" value = "find it" name = "B1" onMouseOut = this. style. color = "blue" onMouseOver = this. style. color = "red" class = "button">
4. flat button <input type = submit value = subscription style = "border: 1px solid: #666666; height: 17px; width: 25pt; font-size: 9pt; BACKGROUND-COLOR: # E8E8FF; color: #666666 "name =" submit ">
5. button COLOR variation <input type = text name = "nick" style = "border: 1px solid #666666; font-size: 9pt; height: 17px; BACKGROUND-COLOR: # F4F4FF; color: # ff6600 "size =" 15 "maxlength =" 16 ">
6. Flat input box <input type = "text" name = "T1" size = "20" style = "border-style: solid; border-width: 1">
7. Change the window to the specified size. <script> window. resizeTo (300,283); </script>
8. scroll up or down the text <marquee direction = up scrollamount = 1 scrolldelay = 100 onmouseover = 'this. stop () 'onmouseout = 'this. start () 'height = 60> <! -- Head_scrolltext --> <tr> <td> Republic </table> <! -- End head_scrolltext --> </marquee>
9. the status bar shows the Page status <base onmouseover = "window. status = 'website construction http://www.webmake.cn/'; return true">
10. you can click the text to select the radio option <br> & nbsp; <input type = "radio" name = "regtype" value = "A03" id = "A03"> <label for = "A03"> couples: register two accounts at a time </label> <br>
11. onclick events can be written in the font of the text field.
12. print </a> print the webpage <a href = 'javascript: window. print () '>
13. line type input box <input type = "text" name = "key" size = "12" value = "keyword" onFocus = this. select () onMouseOver = this. focus () class = "line">
14. display the last modification date of the document <script language = javascript> function hi (str) {document. write (document. lastModified) alert ("hi" + str + "! ")} </Script>
15. The event can be triggered when you move the cursor over the text.
16. You can determine the page color based on the options on the webpage. <HTML> <HEAD> <TITLE> background.html </TITLE> </HEAD> <SCRIPT> <! -- Function bgChange (selObj) {newColor = selObj. options [selObj. selectedIndex]. text; document. bgColor = newColor; selObj. selectedIndex =-1;} // --> </SCRIPT> <body style = "font-family: arial "> <B> Changing Background Colors </B> <BR> <FORM> <SELECT SIZE =" 8 "onChange =" bgChange (this ); "> <OPTION> Red <OPTION> Orange <OPTION> Yellow <OPTION> Green <OPTION> Blue <OPTION> Indigo <OPTION> Violet <OPTION> White <OPTION> pink </ SELECT> </FORM> </BODY> </HTML>
17. Change the button feature <style type = "text/css"> <! --. Style1 {font-size: 12px; background: # CCCCFF; border-width: thin; border-color: # CCCCFF # CCCCCC # CCCCFF }. style2 {font-size: 12px; font-weight: bold; background: # CCFFCC; border-width: thin medium thin; border-color: # CCFF99 #999999 #999999 # CCFF99} --> </style> the code for the buttons in this example is as follows: <input type = "submit" name = "Submit" value = "submit" onmouseover = "this. className = 'style2' "onmouseout =" this. className = 'style1' "class =" style1 ">
18. Change the button image. <style type = "text/css"> <! --. Style3 {font-size: 12px; background: url (image/buttonbg1.gif); border: 0px; width: 60px; height: 22px }. style4 {font-size: 12px; font-weight: bold; background: url (image/buttonbg2.gif); border: 0px 0; width: 60px; height: 22px} --> </style> the button code in this example is as follows: <input type = "submit" name = "Submit2" value = "submit" onmouseover = "this. className = 'style4' "onmouseout =" this. className = 'style3' "class =" style3 ">
19. Print the page <div align = "center"> <a class = content href = "javascript: doPrint ();"> Print the draft </a> </div>
20. You can directly write the html language document. write ("");
21. change the color of the drop-down box <select name = "classid" onChange = "changelocation (document. myform. classid. options [document. myform. classid. selectedIndex]. value) "size =" 1 "style =" color: #008080; font-size: 9pt ">
22. Go to the target URLwindow. location = http: // guoguo
23. Pass the formUpdateSN ('guoqiang99267', this. form) function UpdateSN (strValue, strForm) {strForm. SignInName. value = strValue; return false;} of the object ;}
24. text label <label for = "AltName4"> <input name = "AltName" type = "RADIO" tabindex = "931" id = "AltName4"> guoqiang99859 </label>
25. layer2 is the component ID, which can control whether the component is visible to document. all. item ('layer2 '). style. display = "block"; document. all. item ('layer2 '). style. display = "none ";//
26. Add the page to favorite <script language = javascript> <! -- Function Addme () {url = "http://your.site.address"; // Your Own Homepage Address title = "Your Site Name"; // Your own homepage Name window. external. addFavorite (url, title); --> </script> //
27. automatically close the page in 10 seconds <script language = "JavaScript"> function closeit () {setTimeout ("self. close ()", 10000)} </script>
28. You can compare the character size char = post. charAt (I); if (! ('0' <= char & char <= '9 '))
29. Convert characters to numbers month = parseInt (char)
30. When the value option is clicked, the system redirects to the specified connection <select onchange = 'if (this. value! = "") Window. open (this. value) 'class = "textinput"> <option selected> organizer </option> <option> --------------- </option> <option value = "http://www.bjd.com.cn/"> Beijing Daily </option> <option value = "http://www.ben.com.cn/"> Beijing Evening News </option> </select>
31. change the background color <td width = * class = dp bgColor = # FAFBFC onmouseover = "this. bgColor = '# ffff'; "onmouseout =" this. bgColor = '# FAFBFC'; ">
32. change the background color of the text input box <style>. input2 {background-image: url ('.. /images/inputbg.gif '); font-size: 12px; background-color: # D0DABB; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px }</style> <input name = content type = text size = "47" class = "input2" maxlength = "50">
33. Change the features of the horizontal line
34. how to pass Parameters <a href = "vote. asp? CurPage = 8 & id = 3488 "> 8 </a>
35. <a href = "#1"> 1 </a> <a href = "#2"> 2 </a> <a href = "#3"> 3 </a> <a href = "#4"> 4 </a> <a href = "#5"> 5 </a> <a href = "#6 "> 6 </a> <a href =" #7 "> 7 </a> <a name =" 1 "> dfdf </a> <a name =" 2 "> dfdf </a> //
36. Press if (event. ctrlKey & window. event. keyCode = 13) together with the two buttons )//
37. Refresh the page javascript: this. location. reload ()//
38. enable <script language = "JavaScript"> function haha () {for (var I = 0; I <document. form1.elements. length; I ++) {if (document. form1.elements [I]. name. indexOf ("bb ")! =-1) document. form1.elements [I]. disabled =! Document. form1.elements [I]. disabled ;}</SCRIPT> <BODY> <form name = form1> <input type = "button" NAME = "aa" value = cindy onclick = haha ()> <input type = "button" NAME = "bb" value = guoguo> <input type = "button" NAME = "bb" value = guoguo>
39. Text movement <marquee scrollamount = 3 onmouseover = this. stop (); onmouseout = this. start ();>
40. double-click the webpage to automatically run <script language = "JavaScript"> var currentpos, timer; function initialize () {timer = setInterval ("scrollwindow ()", 1);} function SC () {clearInterval (timer);} function scrollwindow () {currentpos = document. body. scrollTop; window. scroll (0, ++ currentpos); if (currentpos! = Document. body. scrollTop) SC ();} document. onmousedown = scdocument. ondblclick = initialize </SCRIPT> //
41. Backward <input type = "button" onclick = window. history. back () value = back>
42. forward <input type = "button" onclick = window. history. forward () value = forward>
43. Refresh <input type = "button" onclick = document. location. reload () value = reload>
44. navigate to the specified webpage document. location = "http: // ww" or document. location. assign (http://guoguo.com)
45. display the Real-Time on the webpage <script language = "JavaScript"> var clock_id; window. onload = function () {clock_id = setInterval ("document.form1.txt clock. value = (new Date); ", 1000)} </SCRIPT> //
46. You can download the document. location. href = "target file "//
47. connect to the Database import java. SQL. *; String myDBDriver = "sun. jdbc. odbc. jdbcOdbcDriver "; Class. forName (myDBDriver); Connection conn = DriverManager. getConnection ("jdbc: odbc: firm", "username", "password"); Statement stmt = conn. createStatement (); ResultSet rs1_stmt.exe cuteQuery (SQL); rs. getString ("column1 ");//
48. <input type = "button" onclick = "a1.innerHTML = '<font color = red> * </font>'"> <div id = a1> </div> //
49. you can change the connection format on the page so that it is A two-line <style> A: link {text-decoration: none; color: # 0000FF; font-family: }: visited {text-decoration: none; color: # 0000FF; font-family:} A: hover {text-decoration: underline overline; color: FF0000 }</style> <style> A: link {text-decoration: none; color: # 0000FF; font-family:} A: visited {text-decoration: none; color: # 0000FF; font-family:} A: hover {text-decoration: underline overline line-through; color: FF0000} TH {FONT-SIZE: 9pt} TD {FONT-SIZE: 9pt} body {SCROLLBAR-FACE-COLOR: # A9D46D; SCROLLBAR-HIGHLIGHT-COLOR: # e7e7e7; SCROLLBAR-SHADOW-COLOR: # e7e7e7; SCROLLBAR-3DLIGHT-COLOR: #000000; LINE-HEIGHT: 15pt; SCROLLBAR-ARROW-COLOR: # ffffff; SCROLLBAR-TRACK-COLOR: # e7e7e7;} INPUT {BORDER-TOP-WIDTH: 1px; PADDING-RIGHT: 1px; PADDING-LEFT: 1px; BORDER-LEFT-WIDTH: 1px; FONT-SIZE: 9pt; BORDER-LEFT-COLOR: # cccccc; BORDER-BOTTOM-WIDTH: 1px; BORDER-BOTTOM-COLOR: # cccccc; PADDING-BOTTOM: 1px; BORDER-TOP-COLOR: # cccccc; PADDING-TOP: 1px; HEIGHT: 18px; BORDER-RIGHT-WIDTH: 1px; BORDER-RIGHT-COLOR: # cccccc} DIV, form, OPTION, P, TD, BR {FONT-FAMILY:; FONT-SIZE: 9pt} textarea, select {border-width: 1; border-color: #000000; background-color: # efefef; font-family:; font-size: 9pt; font-style: bold ;}. text {font-family: ""; font-size: 9pt; color: #003300; border: #006600 solid; border-width: 1px 1px1px 1px} </style> complete css
50. Create a frame <ahref = "javascript: newframe ('HTTP: // custom)"> </a>
Author: chow _ zh
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
