Javascript知识【案例:注册表单校验】

简介: 注册表单的校验【附源码】
  <div id="divbg">
     <div id="divFormId">
        <form action="#" method="get" onsubmit="return checkFormData()">
           <table  width="550">
              <tr>
                 <td colspan="3">
                    <font color="#3164af" size="5">会员注册</font> USER REGISTER
                 </td>
              </tr>
              <tr>
                 <td align="right">用户名</td>
                 <td colspan="2"><input type="text" id="username" name="username" size="50"/><span id="usernameSpan" class="errorMsg"></span></td>
              </tr>
              <tr>
                 <td align="right">密码</td>
                 <td colspan="2"><input type="password" id="pwd" name="pwd" size="50"/><span id="pwdSpan" class="errorMsg"></span></td>
              </tr>
              <tr>
                 <td align="right">确认密码</td>
                 <td colspan="2"><input type="password" id="repwd" name="repwd" size="50"/><span id="repwdSpan" class="errorMsg"></span></td>
              </tr>
              <tr>
                 <td align="right">Email</td>
                 <td colspan="2"><input type="text" id="email" name="email" size="50"/> </td>
              </tr>
              <tr>
                 <td align="right">姓名</td>
                 <td colspan="2"><input name="text" id="name" name="name" size="50"/> </td>
              </tr>
              <tr>
                 <td align="right">性别</td>
                 <td colspan="2">
                    <input type="radio" name="sex" value="man" checked="checked" />男
                    <input type="radio" name="sex" value="woman" />女
                 </td>
              </tr>
              <tr>
                 <td align="right">出生日期</td>
                 <td colspan="2"><input type="text" id="birthday" name="birthday" size="50"/> </td>
              </tr>
              <tr>
                 <td width="80" align="right">验证码</td>
                 <td width="100"><input type="text" id="verifyCode" name="verifyCode" /> </td>
                 <td><img src="img/verifyCode.jpg" /> </td>
              </tr>
              <tr>
                 <td></td>
                 <td colspan="2">
                    <input type="image" src="img/submit.jpg"  />
                 </td>
              </tr>
           </table>

        </form>
     </div>
  </div>

相关文章
|
23天前
ractive.js联系表单动画效果源码
一款ractive.js联系表单动画效果,很有创意的发送邮件、联系内容等表单,基于ractive.js实现的动画效果,以发送信件的方式。
24 1
|
1月前
|
前端开发 JavaScript 安全
HTML+CSS+JS密码灯登录表单
通过结合使用HTML、CSS和JavaScript,我们创建了一个带有密码强度指示器的登录表单。这不仅提高了用户体验,还帮助用户创建更安全的密码。希望本文的详细介绍和代码示例能帮助您在实际项目中实现类似功能,提升网站的安全性和用户友好性。
42 3
|
2月前
|
JavaScript 数据安全/隐私保护
2024了,你会使用原生js批量获取表单数据吗
2024了,你会使用原生js批量获取表单数据吗
53 4
|
2月前
|
JavaScript 前端开发 数据安全/隐私保护
前端技术分享:使用Vue.js构建响应式表单
【10月更文挑战第1天】前端技术分享:使用Vue.js构建响应式表单
|
3月前
|
JavaScript 前端开发
js_Ipv4以及ipv4段正则校验
几种JavaScript正则表达式,用于校验IPv4地址的有效性,包括支持CIDR表示法的变体。
84 4
|
3月前
|
移动开发 JavaScript 前端开发
js之操作表单 | 12-4
js之操作表单 | 12-4
|
3月前
|
移动开发 前端开发 JavaScript
JavaScript 表单
JavaScript 表单
29 9
|
2月前
|
前端开发 JavaScript
JavaScript动态渲染页面爬取——CSS位置偏移反爬案例分析与爬取实战
JavaScript动态渲染页面爬取——CSS位置偏移反爬案例分析与爬取实战
35 0
|
3月前
|
JavaScript 前端开发
js登录注册简单tab切换页面(含前台表单验证)
文章介绍了如何使用HTML、CSS和JavaScript创建一个简单的登录注册页面,并实现Tab切换效果。包括了表单验证,点击登录或注册按钮时,可以切换显示相应的表单。同时提供了完整的前端代码和实现效果图。
|
3月前
|
人工智能 前端开发 JavaScript
react js 处理表单( form )的2个例子
react js 处理表单( form )的2个例子