Skip to content
Related Articles

Related Articles

Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.

Hide the Email Id in a form using HTML and JavaScript

Improve Article
Save Article
Like Article
  • Last Updated : 23 Apr, 2019

Here the following task is going to be formed with HTML code:
1.Input field: We are going to enter the email id in this field.
2.Button: On clicking this button hidden email id will be displayed.
3.Output field: Field to display hidden email id.


Output :robin*****

Output :geeks*****

HTML code :

<!DOCTYPE html>
         <script type="text/javascript">
            function test_str(){
               var str = document.getElementById("t1").value ;
               var idx = str.indexOf('@');
               var res = str.replace(str.slice(5, idx), "*".repeat(5));
               document.getElementById("t2").value = res;
             Email: <input type="text" placeholder="abc" id="t1"/><br/>
             <input type="button" value="Protect" onclick="test_str()"/><br/>
             Output: <input type="text" id="t2" readonly/>


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!