简体   繁体   中英

how to print multiple barcode images using jquery

I have generated multiple barcodes using this code:

function getCode() {
    var multipleCodes = document.getElementById('codeArea').value;
    var eachLine = multipleCodes.split('\n');
    console.log("eachLine = " + eachLine);
    for (var i = 0; i < eachLine.length; i++) {
        console.log("Inside loop: " + eachLine[i]);

        var div = document.createElement('iframe');
        div.innerHTML = "";

        div.setAttribute('id', 'iFrameID' + i);
        document.body.appendChild(div);
        document.getElementById('iFrameID' + i).src = 'barCodeGenerator/generateBarCode.php?q=' + eachLine[i];

    }

and trying to print it by using this method:

function printDiv(divName) {
    var strName = document.getElementById("codeArea").value;
    var imageId = document.getElementsByClassName('decoded');

    var imagObject = new Image();
    imagObject = imageId;
    var originalImage = '<img id="imageViewer" src="' + imageSrc + '" style="padding-top: 20px"   alt="' + imageSrc + '" />';
    popup = window.open('', 'popup', 'toolbar=no,menubar=no,width=700,height=650');
    popup.document.open();
    popup.document.write("<html><head></head><body onload='print()'>");
    popup.document.write(originalImage);
    popup.document.write("</body></html>");
    window.close('popup');
    popup.document.close();
    setTimeout(function () { popup.close(); }, 8000);
}

which only print single image by merging all barcodes. How can i print them separately as multiple images. Any help will be appreciated.

The most part of this code is irrelevant to your question. Consider removing your logs, the parts about showing popup and hiding it for more clearance.

Seems imageSrc variable in your code contains the source of one image, so you need to change your code by sending the array of image sources and iterating over it:

var originalImage = '';
// assuming imageSrc is an array of image sources
for (var i=; i < imageSrc.length; i++) {

    // note that I'm changing the id of the image a litle bit to ensure it will remain unique
    originalImage  += '<img id="imageViewer' + i + '" src="' + imageSrc[i] + '" style="padding-top: 20px"   alt="' + imageSrc[i] + '" />';

}

then the rest of your code must work.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM