博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

JavaScript日期、邮箱验证和隐藏控件(初级)

Posted on 2008-10-23 17:20  hyd309  阅读(593)  评论(0编辑  收藏  举报

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="000000000.aspx.cs" Inherits="_000000000" %>

<!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 runat="server">
    <title>无标题页</title>

    <script type="text/javascript">
        function toggle(id,id1)
        {
        alert("000");
            if(id1.toString()=="txt1")
            {
                alert("11");
                alert(document.all(id1).value);
            }
            else
            {alert("00");
                var oDiv=document.getElementById(id);
                alert("001");
                alert(oDiv.style.height);
               
                oDiv.style.display=(oDiv.style.display=="none") ? "block" : "none"; //判断控件是否隐藏?显示,隐藏控件
                alert("002");
                var oDiv1=document.getElementById(id1);
                alert(oDiv1.style.height);
                oDiv1.style.display=(oDiv1.style.display=="none") ? "block" : "none";
            }
        }
       
        function hevent(evt)
        {
            alert(evt.type);
            document.all("txt1").value="sdfdfddd";
            alert(evt.clientX);
            alert(evt.screenX);
        }
       
        function date(id)
        {
          
            var dt=document.all("txt1").value;
            //var reDate=/(?:0[1-9]|[12][0-9]|3[01])\-(?:0[1-9]|1[0-2])\-(?:19|20\d{2})/; //格式为:dd/mm/yy
            //   yy//mm//dd为: dd mm 都为两位数
            var reDate=/(?:19|20\d{2})\-(?:0[1-9]|1[0-2])\-(?:0[1-9]|[12][0-9]|3[01])/;
             alert(dt);
            alert(reDate.test(dt));
        }
       
        function Email(id)
        {
            var dt=document.all("txt1").value;
            var reEmail=/^(?:\w+\.?)*\w+@(?:\w+\.?)*\w+$/;
            alert(dt);
            alert(reEmail.test(dt));
        }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div style="background-color: Blue; height: 90px; width: 100%" id="div1">
        </div>
        <div style="background-color: Red; height: 100px; width: 100%" id="div2">
        </div>
        <div style="background-color: White; height: 100px; width: 100%" onclick="toggle('div1','div2')">
            div1</div>
        <div style="background-color: Yellow; height: 100px; width: 100%" onclick="toggle('div2','div1')">
            div2</div>
        <input type="text" id="txt1" />
        <input type="button" id="bt" onclick="toggle('txt1','txt1')" value=" command " />
        <input type="button" id="Button1" onclick="hevent(event)" value=" command " />
        <br />
        <input type="button" id="Button2" onclick="date(txt1)" value=" 验证日期 " />
        <input type="button" id="Button3" onclick="Email(txt1)" value=" 验证邮箱 " />
    </div>
    </form>
</body>
</html>