黑马程序员技术交流社区

标题: HTML [打印本页]
作者: 原子弹    时间: 2014-3-26 01:08
标题: HTML
编写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>


作者: 630681386@qq.co    时间: 2014-3-26 08:59
自己的题目还是自己做
作者: 残梦共飞雪    时间: 2014-3-26 11:40
本帖最后由 残梦共飞雪 于 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。


作者: 无道    时间: 2014-3-26 17:52
我的基础题也有这个，，，。。



欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2