Biblioteca de máscara de entrada multifuncional-máscara de texto

Vista prévia

Descripción

Máscara de texto es una biblioteca de máscara de entrada ligera pero multifuncional que se puede implementar en las aplicaciones de vainilla JavaScript y reAct/AngularJS/Vue.

La biblioteca permite a los usuarios rellenar más fácilmente el campo de entrada donde desea que ingresen el texto en un formato determinado.

Instalación

# NPM
$ npm install vanilla-text-mask --save

¿Cómo funciona?

Importa el núcleo de JavaScript vanillaTextMask. js en tu página HTML.

<script src="/path/to/vanillaTextMask.js"></script>

Defina el formato de datos de la siguiente manera:

var phoneMask = ['(', /[1-9]/, /\d/, /\d/, ')', ' ', /\d/, /\d/, /\d/, '-', /\d/, /\d/, /\d/, /\d/]

Inicializar la máscara de texto en un campo de entrada especificado.

var myInput = document.querySelector('.myInput')

var maskedInputController = vanillaTextMask.maskInput({


inputElement: myInput,


mask: phoneMask
})

Más opciones & funciones disponibles.

vanillaTextMask.maskInput({


// guide or no guide mode

guide: true,


// custom placeholder char

placeholderChar: '_',


// when true, adding or deleting characters will not affect the positions of existing characters.

keepCharPositions: false,


// display the mask as a placeholder in place of the regular placeholder when the input element value is empty

showMask: true,


// modify the conformed value before it is displayed on the screen

pipe: function(conformedValue, config){


// ...

}


})

Registro de cambios

08/30/2018

• También es compatible con Vue, Ember.