43 表单构成1: <form method=”post” action=”target.html” name=”thisForm”>2: <input type=”text” name=”myText”>3: <select name=”mySelect”>4: <option value=”1”>First Choice</option>5: <option value=”2”>Second Choice</option>6: </select>7: <br>8: <input type=”submit” value=”Submit Me”>9: </form> 44 访问表单中的文本框内容1: <form name=”myForm”>2: <input type=”text” name=”myText”>3: </form>4: <a href='http://www.webjx.com/htmldata/2006-02-06/1139212451.html#' onClick='window.alert(document.myForm.myText.value);'>Check Text Field</a> 45 动态复制文本框内容1: <form name=”myForm”>2: Enter some Text: <input type=”text” name=”myText”><br>3: Copy Text: <input type=”text” name=”copyText”>4: </form>5: <a href=http://www.webjx.com/htmldata/2006-02-06/”#” onClick=”document.myForm.copyText.value =6: document.myForm.myText.value;”>Copy Text Field</a> 46 侦测文本框的变化1: <form name=”myForm”>2: Enter some Text: <input type=”text” name=”myText” onChange=”alert(this.value);”>3: </form> 47 访问选中的Select1: <form name=”myForm”>2: <select name=”mySelect”>3: <option value=”First Choice”>1</option>4: <option value=”Second Choice”>2</option>5: <option value=”Third Choice”>3</option>6: </select>7: </form>8: <a href='http://www.webjx.com/htmldata/2006-02-06/1139212451.html#' onClick='alert(document.myForm.mySelect.value);'>Check Selection List</a> 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 动态改变表单的action1: <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=http://www.webjx.com/htmldata/2006-02-06/”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.value = encrypt(myForm.elements.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>

评论