Chinaunix首页 | 论坛 | 博客
  • 博客访问: 358294
  • 博文数量: 152
  • 博客积分: 6020
  • 博客等级: 准将
  • 技术积分: 850
  • 用 户 组: 普通用户
  • 注册时间: 2006-03-11 19:20
文章分类

全部博文(152)

文章存档

2017年(1)

2010年(1)

2007年(3)

2006年(147)

我的朋友

分类:

2006-04-10 00:17:20

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 Choiceoption>
     
  5. <option value=”2”>Second Choiceoption>
     
  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='#' onClick='window.alert(document.myForm.myText.value);'>Check Text Fielda>

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=#” onClick=”document.myForm.copyText.value =
  6. document.myForm.myText.value;>Copy Text Fielda>

46 侦测文本框的变化
  1. <form name=”myForm”>
  2. Enter some Text: <input type=”text” name=”myText” onChange=”alert(this.value);>
  3. form>

47 访问选中的Select
  1. <form name=”myForm”>
  2. <select name=”mySelect”>
  3. <option value=”First Choice”>1option>
  4. <option value=”Second Choice”>2option>
  5. <option value=”Third Choice”>3option>
  6. select>
  7. form>
  8. <a href='#' onClick='alert(document.myForm.mySelect.value);'>Check Selection Lista>

48 动态增加Select项
     
  1. <form name=”myForm”>
     
  2. <select name=”mySelect”>
     
  3. <option value=”First Choice”>1option>
     
  4. <option value=”Second Choice”>2option>
     
  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”;


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.  

  9. Text Field: 




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. Enter Some Text: 


上面的encryptForm方法把表单中的数据转换为编码,在提交表单之前完成了简单的表单数据加密~
阅读(456) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~