Convenient Spin Box For Number Input - jQuery InputCounter

File Size: 16.8 KB
Views Total: 3740
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Convenient Spin Box For Number Input - jQuery InputCounter

InputCounter is a lightweight, Bootstrap compatible jQuery input spinner plugin for switching numeric values with plus/minus buttons.

How to use it:

1. The basic HTML for the input spinner.

<div class="example">
  <button type="button" class="btn-add">
  <input type="text" class="input-counter">
  <button type="button" class="btn-subtract">

2. Specify the max/min/initial value with the following data attributes:

<input type="text" 

3. Download and insert the jQuery InputCounter's script after jQuery.

<script src="" 
<script src="jquery.input-counter.min.js"></script>

4. Call the function to activate the input spinner.


5. Default CSS selectors.

  selectors: {
    addButtonSelector: '.btn-add',
    subtractButtonSelector: '.btn-subtract',
    inputSelector: '.input-counter',

6. Default plugin settings

  settings: {

    // check the valus is within the min and max values
    checkValue: true, 

    // is read only?
    isReadOnly: true

This awesome jQuery plugin is developed by lk-code. For more Advanced Usages, please check the demo page or visit the official website.