Easy One Time Password Input In JavaScript – vanilla-otp.js

Preview:

Description:

vanilla-otp.js is a simple JavaScript plugin that converts a group of input fields into a one-time password or PIN code input.

It can be used to enhance your application’s security by facilitating a secure way for users to authenticate their identity.

How to use it:

1. Download and import the vanilla-otp.js library.

<script src="vanilla-otp.js"></script>

2.  Create a group of input fields on the page.

<div class="otp-input">
  <input type="text">
  <input type="text">
  <input type="text">
  <input type="text">
</div>

3. Initialize the one-time password input.

let otp = new VanillaOTP('.otp-input');

4. Output the password string in another input field.

let otp = new VanillaOTP('.otp-input', '#result');

5. Get the password string you just typed.

otp.getValue();

6. Set the empty character. Default: sapce.

otp.setEmptyChar('*');