Skip to main content

How To Create Random Password Generator Using JavaScript

Screenshot
Body

Random Password Generator Using JavaScript

In this article, we are going to learn on how to create Random Password Generator Using JavaScript. This article you can use to your projects or systems. This program work by hitting the Generate Password Button then the random password automatically display in the textbox.

HTML Source Code

Copy and paste this source code to your BODY tag.
  1. <form name="password_generate" style="margin:auto; width:400px; margin-top:100px;">
  2.  
  3. <input type="text" size=18 name="output" autofocus="autofocus" style="font-family: cursive; text-align: center; color: blue; font-size: 20px; border: 1px solid blue; width: 182px; text-indent: 5px; background: azure;">
  4. <input type="button" value="Generate Password" onClick="execute_To_Generate(this.form.password_Length.value)" style="border-radius: 8px; color: red; background: azure; border: 1px solid red; font-size: 22px;">
  5. <br />
  6. <br />
  7. <b style="font-family:cursive; font-size:23px; color:blue;">Password Length:</b> <input type="text" name="password_Length" value="7"style="font-family: cursive; text-align: center; color: blue; font-size: 20px; border: 1px solid blue; width: 50px; background: azure;" readonly />
  8.  
  9. </form>

Script

This script for the auto password generator.
  1. <script>
  2. var pattern_list="abcdefghijklmnopqrstuvwxyz123456789"
  3. var example=''
  4.  
  5. function generate_password(plength){
  6. example=''
  7. for (i=0;i<plength;i++)
  8. example+=pattern_list.charAt(Math.floor(Math.random()*pattern_list.length))
  9. return example
  10. }
  11.  
  12. function execute_To_Generate(enterlength){
  13. document.password_generate.output.value=generate_password(enterlength)
  14. }
  15. </script>

This is the result:

Result And, that's it. You have successfully created a simple password generator. Share us your thoughts and comments below. Thank you so much for dropping by and reading this tutorial post. For more updates, don’t hesitate and feel free to visit this website more often and please share this with your friends or email me at [email protected]. Practice Coding. Thank you very much.

Add new comment