DOM-manipulation-codes/email.html at master · YuktiMutreja/DOM-manipulation-codes · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<html>
    <head>
        <title>Regular expression</title>
        <script type="text/javascript">
        function validate()
        {
             var text=document.getElementById("text1").value;
             var regx=/^([a-z A-Z 0-9 \. -]+)@([a-z A-Z 0-9-]+).([a-z]{2,8})(.[a-z]{2,8})?$/;
             if(regx.test(text))
             {
                 document.getElementById("lb1text").innerHTML="valid";
                 document.getElementById("lb1text").style.visibility="visible";
                 document.getElementById("lb1text").style.color="red";
             }
             else
             {
                document.getElementById("lb1text").innerHTML="invalid";
                document.getElementById("lb1text").style.visibility="visible";
                document.getElementById("lb1text").style.color="green";
             }
        }
        </script>
    </head>  <!-- + in regx means that it has minimum of 1 characters enter and max upto any size-->
    <!-- . can also not be used directly....thus we add "\" before . -->
    <!--"?" in the end makes it an optional-->
    <body>
        <form>
            <input id="text1" placeholder="email" type="text"/>
            <br>
            <label id="lb1text" style="color:red; visibility:hidden">INVALID</label>
            <br>
            <button onclick="validate()" type="button">Submit</button>
        </form>
    </body>
</html>