Sample Code for generating a bar code using JS

This article mainly introduces the function of generating one-dimensional code (barcode) by JS, and analyzes the specific steps and related operation skills of generating a barcode by using the complete example, for more information about how to generate a one-dimensional code (barcode) by using JavaScript, you can use a complete example to analyze the specific steps and related operation skills of generating a barcode by using the JS plug-in, for more information, see

This article describes how to generate a one-dimensional code (barcode) function in JavaScript. We will share this with you for your reference. The details are as follows:

1. js code:

(Function () {if (! Exports) var exports = window; var BARS = [empty, 222221,121223, 121322,131222, 122213,122312, empty, 223211,221132, empty, 201710000, 2017, 232121,111323, 135693,1321, expires, 111083,112331, 135691,113123, expires, 121421,141122, keys, 112412,122114, 122411,142112, numbers, 111143,111341, 131141,114113, numbers, 23311120], START_BASE = 38, STOP = 106; function code128 (code, barcodeType) {if (arguments. length <2) barcodeType = code128Detect (code); if (barcodeType = 'C' & code. length % 2 = 1) code = '0' + code; var a = parseBarcode (code, barcodeType); return bar2html (. join ('') +''+ Code +'';} Function bar2html (s) {for (var pos = 0, sb = []; pos
 
  
');} Return sb. join ('');} function code128Detect (code) {if (/^ [0-9] + $ /. test (code) return 'C'; if (/[a-z]/. test (code) return 'B'; return 'a';} function parseBarcode (barcode, barcodeType) {var bars = []; bars. add = function (nr) {var nrCode = BARS [nr]; this. check = this. length = 0? Nr: this. check + nr * this. length; this. push (nrCode | ("UNDEFINED:" + nr + "->" + nrCode) ;}; bars. add (START_BASE + barcodeType. charCodeAt (0); for (var I = 0; I
  
   
106) throw new Error ("Unrecognized character (" + code + ") at position" + I + "in code" + barcode + "'. "); bars. add (converted);} bars. push (BARS [bars. check % 103], BARS [STOP]); return bars;} var fromType = {A: function (charCode) {if (charCode> = 0 & charCode <32) return charCode + 64; if (charCode >=32 & charCode <96) return charCode-32; return charCode ;}, B: function (charCode) {if (charCode >=32 & charCode <128) return charCode-32; return charCode ;}, C: function (charCode) {return charCode ;}}; // -- | Export exports. code128 = code128;}) ();/* showp: represents the pID to be displayed, textVlaue: represents the value to be generated, barcodeType: represents the generation type (A, B, C) three types */function createBarcode (showp, textValue, barcodeType) {var pElement = document. getElementById (showp); pElement. innerHTML = code128 (textValue, barcodeType );}
  
 

2.css code:

.barcode { float:left; clear:both; padding: 0 10px; /*quiet zone*/ overflow:auto; height:0.5in; /*size*/}.right { float:right; }.barcode + * { clear:both; }.barcode p { float:left; height: 0.35in; /*size*/}.barcode .bar1 { border-left:1px solid black; }.barcode .bar2 { border-left:2px solid black; }.barcode .bar3 { border-left:3px solid black; }.barcode .bar4 { border-left:4px solid black; }.barcode .space0 { margin-right:0 }.barcode .space1 { margin-right:1px }.barcode .space2 { margin-right:2px }.barcode .space3 { margin-right:3px }.barcode .space4 { margin-right:4px }.barcode label { clear:both; display:block; text-align:center; font: 0.125in/100% helvetica; /*size*/}/*** bigger ******************************************/.barcode2 { float:left; clear:both; padding: 0 10px; /*quiet zone*/ overflow:auto; height:1in; /*size*/}.barcode2 + * { clear:both; }.barcode2 p { float:left; height: 0.7in; /*size*/}.barcode2 .bar1 { border-left:2px solid black; }.barcode2 .bar2 { border-left:4px solid black; }.barcode2 .bar3 { border-left:6px solid black; }.barcode2 .bar4 { border-left:8px solid black; }.barcode2 .space0 { margin-right:0 }.barcode2 .space1 { margin-right:2px }.barcode2 .space2 { margin-right:4px }.barcode2 .space3 { margin-right:6px }.barcode2 .space4 { margin-right:8px }.barcode2 label { clear:both; display:block; text-align:center; font: 0.250in/100% helvetica; /*size*/}

3.html code:

   QR-Code Clock