pincode-input
A very useful pure javascript library to creating pin code inputs.
Inspired by vue-pincode-input
Install
npm i pincode-input
import PincodeInput from 'pincode-input'
import 'pincode-input/dist/pincode-input.min.css'
Include
<!-- CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pincode-input@0.4.2/dist/pincode-input.min.css" />
<!-- JS -->
<script src="https://cdn.jsdelivr.net/npm/pincode-input@0.4.2/dist/pincode-input.min.js"></script>
Usage
<div id="demo"></div>
new PincodeInput('#demo', {
count: 4,
secure: false,
previewDuration: 200,
onInput: (value) => {
console.log(value)
}
})
Parameters
Name | Type | Default | Description |
---|---|---|---|
count | number | 4 | Count of the cells. |
secure | boolean | false | Set to true to use the inputs with type="password"
|
previewDuration | number | 200 | Duration of the character preview. Valid when used with secure: true
|
numeric | boolean | true | Do the inputs only accept numbers? |
uppercase | boolean | true | Convert the characters to uppercase? |
Events
Name | Description |
---|---|
onInput | Returns current value. |