Vamos a crear un código QR para nuestras aplicaciones o sistemas usando la libreria QRcore.js
💡 ¿Quieres aprender más? Este artículo es parte de nuestra Recopilación de Plugins JavaScript y jQuery → donde encontrarás más de 20 tutoriales gratuitos esperándote para llevar tus habilidades al siguiente nivel.
Lo primero que tendremos que hacer sera descargar la libreria Qrcode.js de la pagina web del autor, en enlace se encuentra en el apartado de referencias.
Una vez descargada la libreria Qrcode.js , tambien necesitaremos la libreria jQuery que ya viene en el paquete de descarga.
Codigo
Para empezar a crear nuestro ejemplo, vamos a crear un archivo HTML y en el head del documento vamos a agregar las librerias.
<script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="qrcode.js"></script>
Ahora vamos a crear un div o contenedor donde se va a mostrar el Qr generado.
<div id="qrcode" style="width:150px; height:150px; margin-top:20px;"></div>
Ahora vamos con el código javascript, el cual va a procesar y generar el codigo QR.
<script>
// Primero definimos la el ID del contenedor y las medidas que tendra el QE.
var qrcode = new QRCode(document.getElementById("qrcode"), {
width : 150,
height : 150
});
// El metodo makeCode sirve para generar el codigo con el texto o valor que se pasa como parametro
qrcode.makeCode("https://evilnapsis.com"); // se genera el qr con el valor https://evilnapsis.com
</script>y el resultado al ejecutar el archivo html es el qr generado exitosamente.
Ustedes pueden pasar como parametro el texto que quieran, mas adelante veremos un ejemplo usando un input text.
Referencias
A continuación el enlace de la pagina oficial
¿Necesitas un software de ventas listo para producción?
Inventio Max es la solución profesional con soporte para múltiples almacenes, reportes avanzados y gestión de usuarios.
Ver Inventio Max – Sistema de Inventario y Ventas Profesional →