JavaScript方法和技巧大全

48 动态增加Select项

1: <form name=”myForm”>
2: <select name=”mySelect”>
3: <option value=”First Choice”>1</option>
4: <option value=”Second Choice”>2</option>
5: </select>
6: </form>
7: <script language=”JavaScript”>
8: document.myForm.mySelect.length++;
9: document.myForm.mySelect.options[document.myForm.mySelect.length - 1].text = “3”;
10: document.myForm.mySelect.options[document.myForm.mySelect.length - 1].value = “Third Choice”;
11: </script>

49 验证表单字段

1: <script language=”JavaScript”>
2: function checkField(field) {
3: if (field.value == “”) {
4: window.alert(“You must enter a value in the field”);
5: field.focus();
6: }
7: }
8: </script>
9: <form name=”myForm” action=”target.html”>
10: Text Field: <input type=”text” name=”myField”onBlur=”checkField(this)”>
11: <br><input type=”submit”>
12: </form>

50 验证Select项

1: function checkList(selection) {
2: if (selection.length == 0) {
3: window.alert(“You must make a selection from the list.”);
4: return false;
5: }
6: return true;
7: }

51 动态改变表单的action

1: <form name=”myForm” action=”login.html”>
2: Username: <input type=”text” name=”username”><br>
3: Password: <input type=”password” name=”password”><br>
4: <input type=”button” value=”Login” onClick=”this.form.submit();”>
5: <input type=”button” value=”Register” onClick=”this.form.action = ‘register.html’; this.form.submit();”>
6: <input type=”button” value=”Retrieve Password” onClick=”this.form.action = ‘password.html’; this.form.submit();”>
7: </form>

52 使用图像按钮

1: <form name=”myForm” action=”login.html”>
2: Username: <input type=”text” name=”username”><br>
3: Password: <input type=”password”name=”password”><br>
4: <input type=”image” src="/”login.gif"” value=”Login”>
5: </form>
6:

53 表单数据的加密

1: <SCRIPT LANGUAGE='JavaScript'>
2: <!--
3: function encrypt(item) {
4: var newItem = '';
5: for (i=0; i < item.length; i++) {
6: newItem += item.charCodeAt(i) + '.';
7: }
8: return newItem;
9: }
10: function encryptForm(myForm) {
11: for (i=0; i < myForm.elements.length; i++) {
12: myForm.elements[i].value = encrypt(myForm.elements[i].value);
13: }
14: }
15:
16: //-->
17: </SCRIPT>
18: <form name='myForm' onSubmit='encryptForm(this); window.alert(this.myField.value);'>
19: Enter Some Text: <input type=text name=myField><input type=submit>
20: </form>

JavaScript就这么回事5：窗口和框架

54 改变浏览器状态栏文字提示

1: <script language=”JavaScript”>
2: window.status = “A new status message”;
3: </script>

55 弹出确认提示框

1: <script language=”JavaScript”>
2: var userChoice = window.confirm(“Click OK or Cancel”);
3: if (userChoice) {
4: document.write(“You chose OK”);
5: } else {
6: document.write(“You chose Cancel”);
7: }
8: </script>

56 提示输入

1: <script language=”JavaScript”>
2: var userName = window.prompt(“Please Enter Your Name”,”Enter Your Name Here”);
3: document.write(“Your Name is “ + userName);
4: </script>

57 打开一个新窗口

1: //打开一个名称为myNewWindow的浏览器新窗口
2: <script language=”JavaScript”>
3: window.open(“http://www.liu21st.com/”,”myNewWindow”);
4: </script>

58 设置新窗口的大小

1: <script language=”JavaScript”>
2: window.open(“http://www.liu21st.com/”,”myNewWindow”,'height=300,width=300');
3: </script>

59 设置新窗口的位置

1: <script language=”JavaScript”>
2: window.open(“http://www.liu21st.com/”,”myNewWindow”,'height=300,width=300,left=200,screenX=200,top=100,screenY=100');
3: </script>

60 是否显示工具栏和滚动栏

1: <script language=”JavaScript”>
2: window.open(“http:

61 是否可以缩放新窗口的大小

1: <script language=”JavaScript”>
2: window.open('http://www.liu21st.com/' , 'myNewWindow', 'resizable=yes' );</script>

62 加载一个新的文档到当前窗口

1: <a href='#' onClick='document.location = '125a.html';' >Open New Document</a>

63 设置页面的滚动位置

1: <script language=”JavaScript”>
2: if (document.all) { //如果是IE浏览器则使用scrollTop属性

 如果您对本文有任何疑问或者建议，请到讨论区发表您的意见: >> 论坛入口 <<