HTML 表单制作

来源：互联网发布：淘宝店铺旺旺在哪里编辑：程序博客网时间：2024/05/16 10:18

<!doctype html><html><head><meta charset="GB2312"><title>我的主页</title></head><body><h3>教学意见调查表</h3><form method="post" action="" enctype="text/plain"><fieldset><legend>个人及课程资料</legend><ol>  <li>科目名称<input type="text" name="subject" autofocus/></li>  <li>请选择系所:  <select size="1" name="department">  <option>音乐系</option>  <option>法律系</option>  <option>英语系</option>  <option>土木系</option>  <option>电子工程系</option>  <option>商务管理系</option>  </select>  </li>  <li>讲师：<input type="text" name="teacher"></li>  <li>性别：  <input type="radio" name="sex" value="女生" checked/>女生  <input type="radio" name="sex" value="男生"/>男生  </li>  <li>开课日期：<input type="date" name="startdate"/>  </li></ol></fieldset><fieldset><legend>意见调查</legend><ol>  <li>这门课的出勤状况是  <input type="radio" name="assist" value="没有缺课"/>没有缺课   <input type="radio" name="assist" value="缺课1-3次"/>缺课1-3次   <input type="radio" name="assist" value="缺课3-5次"/>缺课3-5次   </li>  <li>选这门课的原因（可所选）：  <input type="checkbox" name="reason" value="必修"/>必修  <input type="checkbox" name="reason" value="凑学分"/>凑学分  <input type="checkbox" name="reason" value="感兴趣"/>感兴趣  <input type="checkbox" name="reason" value="其它"/>其它  </li>  <li>请简述你对此门课程的期望和意见：<br/>  </li></ol></fieldset><textarea rows="4" name="hope" cols="60"></textarea><input type="submit" value="提交"/><input type="reset" value="重写"/></form>  </body></html>

效果图：

注意事项：

1.单选框对应的name属性名称保持一致，保持互斥性。

2.复选框对应的name属性保持一致，页面可以根据name获取到多个值。

3.日期可以使用日期插件，如：My97DatePicker。

My97DatePicker是一款优秀的日期插件，它可以很方便地实现各种日期选择效果，博得广大IT开发人员的青睐。

下面来讲讲它的常用功能及设置方法。

。

0 0