A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© 原子弹 中级黑马   /  2014-3-26 01:08  /  1258 人查看  /  3 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

编写HTML注册表单,需求字段:用户名,密码,确认密码,性别(单选),兴趣爱好(多选),城市(下拉列表),个人简介(文本域)
        用JavaScript验证这个表单,要求:
        1.用户名:字母数字或下划线10位以内,只能以字母开头
        2.密码:6-16位任意字符
        3.确认密码:和密码保持一致
        4.其他项为必填
==================================================
         这是我的代码   只做出来个界面 ,没有实现里面的  要求
                                      求大神指点
++++++++++++++++++++++++++++++++++++++++++++++++++
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE> 注册界面 </TITLE>

  <script type="text/javascript">
  function fun(){
  if(document.getElementById("m").value!=document.getElementById("rem").value){
                alert("用户名和密码不一致");
                }
  }
  </script>
</HEAD>

<BODY>
  <form action = "" method = "post">
  <table border ="1">
        <tr>
                <td>
                用户名
                </td>
                <td>
                <input type = "text" size = "45">
                </td>
               
        </tr>
        <tr>
                <td id="m">密&nbsp;&nbsp;码</td>
                <td>
                <input type = "password" size = "45">
                </td>
       
        </tr>
        <tr>
                <td id="rem">确认密码</td>
                <td>
                <input type = "password" size = "45">
                </td>
       
        </tr>
        <tr>
                        <td>性&nbsp;&nbsp;别</td>
                        <td>
                        <input type ="radio" checked = "ture" name = "sex">男
                        &nbsp;&nbsp;
                        <input type ="radio" name = "sex">女
                        </td>
        </tr>
        <tr>
                <td>爱&nbsp;&nbsp;号</td>
                <td>
                <input type = "checkbox" name = "hoppy" value = "" checked>篮球
                <input type = "checkbox" name = "hoppy" value = "" >足球
                <input type = "checkbox" name = "hoppy" value = "" >唱歌

                </td>
               
        </tr>
        <tr>
                <td>城&nbsp;&nbsp;市</td>
                <td>
                <select>
                <option value = "bj">北京</option>
                <option value = "sh">上海</option>
                <option value = "gz">广州</option>
                </select>
                </td>
               
               
        </tr>
        <tr>
                <td>个人简介</td>
                <td>
                <textarea cols = "40" rows = "10">不超过200个字</textarea>
                </td>
               
        </tr>
        <tr>
                <td colspan = "2">
                <input type = "submit" value = "确认">
                &nbsp;&nbsp;

                <input type = "reset" value = "取消">
               
                </td>
               
        </tr>

  </table>



  </form>
</BODY>
</HTML>


3 个回复

倒序浏览
自己的题目还是自己做
回复 使用道具 举报
本帖最后由 残梦共飞雪 于 2014-3-26 11:56 编辑
  1. //首先是功能分割。
复制代码

写了一大堆,结果被吞的就剩一句了。
悲催。。


这个你要自己分析。
需求:用户名校验、密码校验、所有选项非空校验。

实现方式:元素失去焦点onblur触发验证单个元素,最终提交onclick触发验证所有。

function checkAll(){
  if(!checkUsername(e))
             retrun false;
  if(!checkPassword(e))
             retrun false;

  if(!checkNotEmpty(e))
             retrun false;
       document.fromName.submit();
}
function checkUsername(e){
//长度校验
//正则表达式限制字符类型
}
function checkPassword(e){
//长度校验
//验证密码、确认密码是否相同
}

function checkNotEmpty(e){
//非空校验
}

如果你要在提交的时候进行一次总的校验,不要使用submit。


回复 使用道具 举报
我的基础题也有这个,,,。。
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马