继续上一次的学习：

<html>

    <head>

        <title>新增雇员</title>

        <script language="javascript" src="study1js/study1.js"></script>

        <script language="javascript" src="study1js/date.js"></script>

    </head>

    <body>

         <form action="" method="">

         <table width="76%" height="392" border="1" align="center" bgcolor="#66CCFF" cellpadding="5" cellspacing="0">

            <tr>

               <td height="36" colspan="3" align="center" valign="middle">增加雇员</td>

            </tr>

             <tr>

               <td width="12%" align="center" valign="middle">雇员编号:</td>

               <td width="10" align="left" valign="middle" ><input type="text" name="empno" onblur="validateEmpno(this.value)"/></td>

               <td width="70%" align="left" valign="middle"><span id="empnomsg">请输入四位数字</span></td>

            </tr>

             <tr>

               <td align="center" valign="middle">雇员姓名:</td>

               <td align="left" valign="middle"><input type="text" name="ename" onblur="validateEname(this.value)"/></td>

               <td align="left" valign="middle"><span id="enamemsg">不能超过10位字符！</td>

            </tr>

             <tr>

               <td align="center" valign="middle">雇员性别:</td>

               <td align="left" valign="middle"><input type="radio" name="sex" value="男" checked="checked" />男&nbsp;&nbsp;<input type="radio" name="sex" value="女"/> 女</td>

               <td>&nbsp;</td>

            </tr>

             <tr>

               <td align="center" valign="middle">雇员家乡:</td>

               <td  width="10" align="left" valign="middle"><select name="city" onChange="homes(this.value)">

                <option>--请选择--</option>

                <option value="北京">北京</option>

                <option value="南京">南京</option>

             </select>

             <input name="citymsg" type="text" /></td>

               <td></td>

            </tr>

             <tr>

               <td align="center" valign="middle">雇员职位:</td>

               <td align="left" valign="middle"><input type="text" name="job" onblur="validateJob(this.value)" /></td>

               <td align="left" valign="middle"><span id="jobmsg">不能超过9位字符！</span></td>

            </tr>

             <tr>

               <td align="center" valign="middle">雇员日期:</td>

               <td align="left" valign="middle"><input type="text" name="hiredate" onclick='popUpCalendar(this, this, "yyyy-mm-dd")' onblur="validateHiredate(this.value)" /></td>

               <td align="left" valign="middle"><span id="hiredatemsg">请选择日期！日期格式（yyyy-MM-dd）</span></td>

            </tr>

             <tr>

               <td align="center" valign="middle">雇员薪水:</td>

               <td align="left" valign="middle"><input type="text" name="sal" onblur="validateSal(this.value)"/></td>

               <td align="left" valign="middle"><span id="salmsg">工资为数字</span></td>

            </tr>

             <tr>

               <td  align="center" valign="middle">雇员佣金:</td>

               <td align="left" valign="middle"><input type="text" name="comm"/></td>

               <td></td>

            </tr>

             <tr>

               <td  align="center" valign="middle">兴趣爱好:</td>

               <td colspan="2" align="left" valign="middle"><input type="checkbox" name="ist" value="电视"/>电视&nbsp;<input type="checkbox" name="ist" value="电影"/>电影&nbsp;<input type="checkbox" name="ist" value="音乐"/>音乐</td>

            </tr>

             <tr>

               <td  align="center" valign="middle">备注:</td>

               <td colspan="2" align="left" valign="middle"><textarea cols="60%" rows="6" name="note"></textarea></td>

            </tr>

             <tr>

               <td align="center" valign="middle" colspan="3"><input type="submit" value="增加" name="sub"/>

             &nbsp;&nbsp;<input type="reset" value="重置" name="res" /></td>

            </tr>

         </table>

         </form>

    </body>

</html></html>

效果图：

下一篇 将继续完善表单功能。

HTML学习二的更多相关文章

  1. emberjs学习二(ember-data和localstorage_adapter)

    emberjs学习二(ember-data和localstorage_adapter) 准备工作 首先我们加入ember-data和ember-localstorage-adapter两个依赖项,使用 ...

  2. ReactJS入门学习二

    ReactJS入门学习二 阅读目录 React的背景和基本原理 理解React.render() 什么是JSX? 为什么要使用JSX? JSX的语法 如何在JSX中如何使用事件 如何在JSX中如何使用 ...

  3. TweenMax动画库学习(二)

    目录            TweenMax动画库学习(一)            TweenMax动画库学习(二)            TweenMax动画库学习(三)            Tw ...

  4. Hbase深入学习(二) 安装hbase

    Hbase深入学习(二) 安装hbase This guidedescribes setup of a standalone hbase instance that uses the local fi ...

  5. Struts2框架学习(二) Action

    Struts2框架学习(二) Action Struts2框架中的Action类是一个单独的javabean对象.不像Struts1中还要去继承HttpServlet,耦合度减小了. 1,流程 拦截器 ...

  6. Python学习二：词典基础详解

    作者:NiceCui 本文谢绝转载,如需转载需征得作者本人同意,谢谢. 本文链接:http://www.cnblogs.com/NiceCui/p/7862377.html 邮箱:moyi@moyib ...

  7. Quartz学习--二 Hello Quartz! 和源码分析

    Quartz学习--二  Hello Quartz! 和源码分析 三.  Hello Quartz! 我会跟着 第一章 6.2 的图来 进行同步代码编写 简单入门示例: 创建一个新的java普通工程 ...

  8. SpringCloud学习(二)：微服务入门实战项目搭建

    一.开始使用Spring Cloud实战微服务 1.SpringCloud是什么? 云计算的解决方案?不是 SpringCloud是一个在SpringBoot的基础上构建的一个快速构建分布式系统的工具 ...

  9. DjangoRestFramework学习二之序列化组件、视图组件 serializer modelserializer

      DjangoRestFramework学习二之序列化组件.视图组件   本节目录 一 序列化组件 二 视图组件 三 xxx 四 xxx 五 xxx 六 xxx 七 xxx 八 xxx 一 序列化组 ...

  10. SpringMVC入门学习(二)

    SpringMVC入门学习(二) ssm框架 springMVC  在上一篇博客中,我简单介绍了一下SpringMVC的环境配置,和简单的使用,今天我们将进一步的学习下Springmvc的操作. mo ...

随机推荐

  1. 微信小程序之----消息提示框toast

    toast toast为消息提示框,无按钮,如需关闭弹框可以添加事件设置hidden为true,在弹框显示后经过duration指定的时间后触发bindchange绑定的函数. 官方文档 .wxml ...

  2. 理解Action，Service和Dao功能（转）

    真正理解.区分Action,Service和Dao功能   在不分层的系统里,我们可以将所有的代码都写到一个地方,比如struts的Action类.在这里,我们不仅要处理页面逻辑,还要做业务逻辑,还要 ...

  3. Valgrind 快速入门

    1. 介绍 Valgrind工具组提供了一套调试与分析错误的工具包,能够帮助你的程序工作的更加准确,更加快速.这些工具之中最有名的是Memcheck.它能够识别很多C或者C++程序中内存相关的错误,这 ...

  4. Unity中使用扩展方法解决foreach导致的GC

    对于List这种顺序表,我们解决的时候还是可以使用for代替foreach即可.但是对于非顺序表,比如Dictionary或者Set之类,我们可以扩展方法Foreach,ForeachKey和Fore ...

  5. java制作图片水印

    1.创建缓存图片对象 2.创建Java绘图工具对象 3.将原图绘制到缓存图片对象 4.使用工具将水印绘制到缓存图片对象 5.创建图片编码工具类 6.输出缓存图片对象到目标图片文件 BufferedIm ...

  6. IM 融云 之 初始化及登录

    融云是没有用户体系的,用户登录需要获取token,测试时可以使用网站提供的接口,但是正式是要通过服务器调用专门的接口从融云获取的.并且我没看到融云的重连机制,不知道是否已在SDK内部实现. 现在看来, ...

  7. Linux FTP 服务器配置简单说明

    一.  FTP 说明 linux 系统下常用的FTP 是vsftp, 即Very Security File Transfer Protocol. 还有一个是proftp(Profession ftp ...

  8. Grunt插件之LiveReload 实现页面自动刷新，所见即所得编辑

    苦B的前端每次在制作和修改页面时,都有一个特定的三部曲:coding-save-F5.很多时候都希望自己一改东西,页面就能立刻显示,而现在LiveReload就能做到这点. LiveReload会监控 ...

  9. Delphi中String类型原理介绍

    Delphi中字符串的操作很简单,但幕后情况却相当复杂.Pascal传统的字符串操作方法与Windows不同,Windows吸取了C语言的字符串操作方法.32位Delphi中增加了长字符串类型,该类型 ...

  10. js原生设计模式——9外观模式封装

    1.事件处理程序兼容性封装 <!DOCTYPE html><html lang="en"><head>    <meta charset= ...