txt) </script> </body>
</html>
计算一个页面中图形的个数
<html>
<body> <img border="0" src="hackanm.gif" width="48" height="48"> <br /> <img border="0" src="compman.gif" width="107" height="98">
<p> <script type="text/javascript"> document.write("This document contains: " + document.images.length + " images.") </script> </p> </body>
</html>
显示表单的名字
<html>
<body> <form name="Form1"> Name: <input type="text" size="20"> </form> <form name="Form2"> Age: <input type="text" size="3"> </form>
<p><b>You can use the form's number:</b></p> <script type="text/javascript"> document.write("<p>The first form's name is: ") document.write(document.forms[0].name + "</p>") document.write("<p>The second form's name is: ") document.write(document.forms[1].name + "</p>") </script>
<p><b>Or, the form's name (will not work in Netscape):</b></p> <script type="text/javascript"> document.write("<p>The first form's name is: ") document.write(document.forms("Form1").name + "</p>") document.write("<p>The second form's name is: ") document.write(document.forms("Form2").name + "</p>") </script> </body>
</html>
事件对象
单击弹出窗口
<html> <head> <script type="text/javascript"> function whichButton() { if (event.button==1) { alert("You clicked the left mouse button!") } else { alert("You clicked the right mouse button!") } } </script> </head>
<body onmousedown="whichButton()"> <p>Click in the document. An alert box will alert which mouse button you clicked.</p> </body>
</html>
单击弹出窗口显示鼠标的位置
<html> <head> <script type="text/javascript"> function show_coords() { x=event.clientX y=event.clientY alert("X coords: " + x + ", Y coords: " + y) } </script> </head>
<body onmousedown="show_coords()"> <p>Click in the document. An alert box will alert the x and y coordinates of the cursor.</p> </body>
</html>
按一个键则显示该键的ASCII码
<html> <head> <script type="text/javascript"> function whichButton() { alert(event.keyCode) }
</script> </head>
<body onkeyup="whichButton()"> <p><b>Note:</b> Make sure the right frame has focus when trying this example!</p> <p>Press a key on your keyboard. An alert box will alert the unicode of the key pressed.</p> </body>
</html>
单击任何地方显示鼠标在页面的坐标
<html> <head>
<script type="text/javascript"> function coordinates() { x=event.screenX y=event.screenY alert("X=" + x + " Y=" + y) }
</script> </head> <body onmousedown="coordinates()">
<p> Click somewhere in the document. An alert box will alert the x and y coordinates of the cursor, relative to the screen. </p>
</body> </html>
单击之后显示文档的鼠标坐标
<html> <head>
<script type="text/javascript"> function coordinates() { x=event.x y=event.y alert("X=" + x + " Y=" + y) }
</script> </head> <body onmousedown="coordinates()">
<p> Click somewhere in the document. An alert box will alert the x and y coordinates of the cursor. </p>
</body> </html>
显示SHIFT是否被按下
<html> <head>
<script type="text/javascript"> function isKeyPressed() { if (event.shiftKey==1) { alert("The shift key was pressed!") } else { alert("The shift key was NOT pressed!") } }
</script> </head> <body onmousedown="isKeyPressed()">
<p> Click somewhere in the document. An alert box will tell you if you pressed the shift key or not. </p>
</body> </html>
单击显示我们页中的标签
<html> <head> <script type="text/javascript"> function whichElement() { var tname tname=event.srcElement.tagName alert("You clicked on a " + tname + " element.") } </script> </head>
<body onmousedown="whichElement()"> <p>Click somewhere in the document. An alert box will alert the tag name of the element you clicked on.</p>
<h3>This is a header</h3> <p>This is a paragraph</p> <img border="0" src="ball16.gif" width="29" height="28" alt="Ball"> </body>
</html>
显示事件发生的类型
<html> <head>
<script type="text/javascript"> function whichType() { alert(event.type) } </script> </head>
<body onmousedown="whichType()">
<p> Click on the document. An alert box will alert which type of event occurred. </p>
</body> </html>
表单对象
用表单显示地址:
<html>
<head> <script type="text/javascript"> function getAction() { var x=document.forms.myForm alert(x.action) }
function changeAction() { var x=document.forms.myForm x.action="default.asp" alert(x.action) } </script> </head>
<body> <form name="myForm" action="js_examples.asp"> <input type="button" onclick="getAction()" value="View value of action attribute"> <br /><br /> <input type="button" onclick="changeAction()" value="Change value of action attribute"> </form> </body>
</html>
显示表单所使用的方法
<html>
<head> <script type="text/javascript"> function formMethod() { var x=document.forms.myForm alert(x.method) } </script> </head>
<body> <form name="myForm" method="post"> Name: <input type="text" size="20"><br /><br /> <input type="button" onclick="formMethod()" value="Show method"> </form> </body>
</html>
重置表单
<html> <head>
<script type="text/javascript"> function formReset() { var x=document.forms.myForm x.reset() } </script>
</head> <body>
<form name="myForm"> <p>Enter some text in the text fields and then press the "Reset form" button</p> <input type="text" size="20"><br /> <input type="text" size="20"><br /> <br /> <input type="button" onclick="formReset()" value="Reset form"> </form>
</body> </html>
提交表单
<html>
<head> <script type="text/javascript"> function formSubmit() { document.forms.myForm.submit() } </script> </head>
<body> <form name="myForm" action="js_form_action.asp" method="get"> Firstname: <input type="text" name="firstname" size="20"><br /> Lastname: <input type="text" name="lastname" size="20"><br /><br /> <input type="button" onclick="formSubmit()" value="Submit"> </form> </body>
</html>
对email的验证
<html>
<head> <script type="text/javascript"> function validate() { x=document.myForm at=x.email.value.indexOf("@") if (at == -1) { alert("Not a valid e-mail") return false } } </script> </head>
<body> <form name="myForm" action="tryjs_submitpage.htm" onsubmit="return validate()"> Enter your E-mail: <input type="text" name="email" size="20"> <input type="submit" value="Submit"> </form> <p><b>Note:</b> This example ONLY tests if the e-mail address contains an "@" character. A "real-life" code would have to test for punctuations, spaces and other things as well.</p> </body>
</html>
输入指定的数才能提交表单
<html>
<head> <script type="text/javascript"> function validate() { x=document.myForm txt=x.myInput.value if (txt>=1 && txt<=5) { return true } else { alert("Must be between 1 and 5") return false } } </script> </head>
<body> <form name="myForm" action="tryjs_submitpage.htm" onsubmit="return validate()"> Enter a value from 1 to 5: <input type="text" name="myInput" size="20"> <input type="submit" value="Submit"> </form> </body>
</html>
输入特定长的字符才能提交表单
<html>
<head> <script type="text/javascript"> function validate() { x=document.myForm input=x.myInput.value if (input.length>5) { alert("The field cannot contain more than 5 characters!") return false } else { return true } } </script> </head>
<body> <form name="myForm" action="tryjs_submitpage.htm" onsubmit="return validate()"> Enter some text (you will get a message if you add more than 5 characters): <input type 上一页 [1] [2] [3] [4] [5] [6] [7] 下一页 |