zoukankan      html  css  js  c++  java
  • javascript入门·表单与表单元素总结(表单验证)

    表单提交前的最后验证:通常在表单提交前,我们必须确认用户是否都把必须填/选的做了,如果没有,就不能被提交到服务器,这里我们用到表单的 formname.submit() 看演示,其实这个对于我们修炼道教(错了,是.net)的人来说,有点多余,呵呵,毕竟微软的vs2003-2005都有非常棒棒棒的验证控件,如果有特别需要,自定义的验证也很不错哦,呵呵!!

    演示一:这个也算对表单以及表单元素的一个综合演示了

    用户名:
    所在地区:
    改变当前网页背景色 绿
    <%@LANGUAGE="JAVASCRIPT" CODEPAGE="936"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>表单与表单元素总结(表单验证)</title>
    <script language="javascript">
    function yanzhen(form){//这里主要是验证看表单是否真要提交
    var d=form.dx.options.selectedIndex;//得到二级地区被选择的索引
        if(form.txt.value!=""){//如果txt文本框不等于空
            if(form.dx.options[d].value!=0){//如果二级地区值不为0
                return true;//那么表单可以提交
            }

        }

        
    return false;
    }

    function xiao(x){
    //这个函数是地区菜单的代码,关于联动菜单的
    //
    详细解释在http://www.cnblogs.com/thcjp/archive/2006/08/10/473054.html
        var formm=document.form1;
        
    var dalength=formm.da.options.length;
        
    var group=new Array(dalength);
        
    for(i=0;i<dalength;i++)
            group[i]
    =new Array();
                group[
    0][0]=new Option("请选择省","0")
                group[
    1][0]=new Option("绵阳","绵阳")
                    group[
    1][1]=new Option("成都","成都")
                    group[
    1][2]=new Option("南充","南充")
                group[
    2][0]=new Option("北京","北京")
                group[
    3][0]=new Option("上海","上海")
        
    var dx=formm.dx;
        
    for(l=dx.options.length-1;l>0;l--){
            dx.options[l]
    =null;
        }

        
    for(j=0;j<group[x].length;j++){
            dx.options[j]
    =new Option(group[x][j].text,group[x][j].value)
        }

        dx.options[
    0].selected=true
    }

    function bgc(color){//从下面单选按钮传递的值来看,他已经把我们要的东西直接打包拿来了
        document.bgColor=color//直接把背景赋值即可
    }

    </script>
    </head>

    <body>
    <p>表单提交前的最后验证:通常在表单提交前,我们必须确认用户是否都把必须填/选的做了,如果没有,就不能被提交到服务器,这里我们用到表单的 formname.submit() 看演示,其实这个对于我们修炼道教(错了,是.net)的人来说,有点多余,呵呵,毕竟微软的vs2003-2005都有非常棒棒棒的验证控件,如果有特别需要,自定义的验证也很不错哦,呵呵!!</p>
    <p><strong>演示一:这个也算对表单以及表单元素的一个综合演示了</strong></p>
    <form id="form1" name="form1" method="get" onsubmit="return yanzhen(this)" action="http://thcjp.cnblogs.com" >
      
    <table width="600" border="0" cellspacing="0" cellpadding="5">
        
    <tr>
          
    <td width="163">用户名:</td>
          
    <td width="417"><input name="txt" type="text" id="txt" /></td>
        
    </tr>
        
    <tr>
          
    <td>所在地区:</td>
          
    <td><select name="da" id="da" onchange="xiao(options.selectedIndex)">
            
    <option value="0">请选择</option>
            
    <option value="1">四川</option>
            
    <option value="2">北京</option>
            
    <option value="3">上海</option>
          
    </select>
            
    <select name="dx" id="dx">
              
    <option value="0">请选择省</option>
            
    </select>      </td>
        
    </tr>
        
    <tr>
          
    <td>改变当前网页背景色</td>
          
    <td>
            
    <input type="radio" name="se" value="red" onchange="bgc(this.value)" /> 
            黄
            
    <input type="radio" name="se" value="yellow" onchange="bgc(this.value)" />
            绿
            
    <input type="radio" name="se" value="green" onchange="bgc(this.value)" /></td>
        
    </tr>
        
    <tr>
          
    <td colspan="2" align="center"><input type="submit" value="提交" /></td>
        
    </tr>
      
    </table>
    </form>
    <p>&nbsp;</p>
    </body>

    </html>
  • 相关阅读:
    接口测试
    Face Anti-Spoofing人脸活体检测-双目红外活体检测
    Spring面试题目
    1.多线程说在前面的话
    2.三分钟入门多线程
    卷积计算
    springmvc 后台向页面EasyUI的tree传递数据(JSon格式)
    springmvc 后台向页面EasyUI的Datagrid传递数据(JSon格式)
    分页工具 Pagehelper的学习 (Spring+Mybatis)
    一些免费的WebService的服务网站(转发)
  • 原文地址:https://www.cnblogs.com/thcjp/p/474364.html
Copyright © 2011-2022 走看看