• 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>
  • 相关阅读:
    BZOJ 3205 [Apio2013]机器人 ——斯坦纳树
    BZOJ 3782 上学路线 ——动态规划 Lucas定理 中国剩余定理
    HDU 1423 Greatest Common Increasing Subsequence ——动态规划
    BZOJ 3309 DZY Loves Math ——莫比乌斯反演
    POJ 1038 Bugs Integrated, Inc. ——状压DP
    POJ 3693 Maximum repetition substring ——后缀数组
    POJ 2699 The Maximum Number of Strong Kings ——网络流
    POJ 2396 Budget ——有上下界的网络流
    BZOJ 4650 [Noi2016]优秀的拆分 ——后缀数组
    源码安装python
  • 原文地址:https://www.cnblogs.com/thcjp/p/474364.html
Copyright © 2020-2023  润新知