JavaScript函数未在页面加载时运行

时间:2017-09-19 12:00:22

标签: javascript jquery onload

我正在尝试将从Google电子表格中解析JSON数据的JS文件调整为用于将标签打印到Dymo打印机的格式。脚本如下所示:

//----------------------------------------------------------------------------
//
//  $Id: GoogleSpreadSheet.js 38773 2015-09-17 11:45:41Z nmikalko $ 
//
// Project -------------------------------------------------------------------
//
//  DYMO Label Framework
//
// Content -------------------------------------------------------------------
//
//  DYMO Label Framework JavaScript Library Samples: 
//    Print mulltiple labels using Google Spreadsheet as a data source
//
//----------------------------------------------------------------------------
//
//  Copyright (c), 2010, Sanford, L.P. All Rights Reserved.
//
//----------------------------------------------------------------------------



(function() {
  var label;
  var labelSet;

  function onload() {
    var printButton = document.getElementById('printButton');
    var printersSelect = document.getElementById('printersSelect');

    function createLabelSet(json) {
      console.log('starting to parse the JSON for the labels');
      var labelSet = new dymo.label.framework.LabelSetBuilder();

      for (var i = 0; i < json.length; ++i) {

        var assetID = assetID[i];

        console.log(assetID.id);


        var assetID = assetID[i];
        var staffName = staffName[i];
        var serialNumber = serialNumber[i];
        var assetTag = assetTag[i];

        var address = assetID + '\n' + staffName + '\n' + serialNumber + '\n' + assetTag;

        var record = labelSet.addRecord();
        record.setText("Address", address);
      }

      return labelSet;
    }

    function loadSpreadSheetDataCallback(json) {
      labelSet = createLabelSet(json);
    };

    window._loadSpreadSheetDataCallback = loadSpreadSheetDataCallback;

    function loadSpreadSheetData() {
      removeOldJSONScriptNodes();

      var script = document.createElement('script');

      console.log('starting to create the new elements');

      script.setAttribute('src', 'getLabelsJSON.php?');
      script.setAttribute('id', 'printScript');
      script.setAttribute('type', 'text/javascript');
      document.documentElement.firstChild.appendChild(script);

      console.log(script);
    };

    function removeOldJSONScriptNodes() {
      var jsonScript = document.getElementById('printScript');
      if (jsonScript)
        jsonScript.parentNode.removeChild(jsonScript);
    };
    // create address label xml
    function getAddressLabelXml() {

      var labelXml = '<?xml version="1.0" encoding="utf-8"?>\
                            <DieCutLabel Version="8.0" Units="twips">\
	                            <PaperOrientation>Landscape</PaperOrientation>\
	                            <Id>Address</Id>\
	                            <PaperName>30252 Address</PaperName>\
	                            <DrawCommands>\
		                            <RoundRectangle X="0" Y="0" Width="1581" Height="5040" Rx="270" Ry="270" />\
	                            </DrawCommands>\
	                            <ObjectInfo>\
		                            <AddressObject>\
			                            <Name>Address</Name>\
			                            <ForeColor Alpha="255" Red="0" Green="0" Blue="0" />\
			                            <BackColor Alpha="0" Red="255" Green="255" Blue="255" />\
			                            <LinkedObjectName></LinkedObjectName>\
			                            <Rotation>Rotation0</Rotation>\
			                            <IsMirrored>False</IsMirrored>\
			                            <IsVariable>True</IsVariable>\
			                            <HorizontalAlignment>Left</HorizontalAlignment>\
			                            <VerticalAlignment>Middle</VerticalAlignment>\
			                            <TextFitMode>ShrinkToFit</TextFitMode>\
			                            <UseFullFontHeight>True</UseFullFontHeight>\
			                            <Verticalized>False</Verticalized>\
			                            <StyledText>\
				                            <Element>\
					                            <String>DYMO\
                                        828 San Pablo Ave Ste 101\
                                        Albany, CA 94706-1678</String>\
                                                            <Attributes>\
                                                                <Font Family="Arial" Size="12" Bold="False" Italic="False" Underline="False" Strikeout="False" />\
                                                                <ForeColor Alpha="255" Red="0" Green="0" Blue="0" />\
                                                            </Attributes>\
                                                        </Element>\
                                                    </StyledText>\
                                                    <ShowBarcodeFor9DigitZipOnly>False</ShowBarcodeFor9DigitZipOnly>\
                                                    <BarcodePosition>AboveAddress</BarcodePosition>\
                                                    <LineFonts>\
                                                        <Font Family="Arial" Size="12" Bold="False" Italic="False" Underline="False" Strikeout="False" />\
                                                        <Font Family="Arial" Size="12" Bold="False" Italic="False" Underline="False" Strikeout="False" />\
                                                        <Font Family="Arial" Size="12" Bold="False" Italic="False" Underline="False" Strikeout="False" />\
                                                    </LineFonts>\
                                     </AddressObject>\
                                     <Bounds X="332" Y="150" Width="4455" Height="1260" />\
                                  </ObjectInfo>\
                             </DieCutLabel>';
      return labelXml;
    }

    function loadLabel() {
      // use jQuery API to load label
      //$.get("Address.label", function (labelXml) {
      label = dymo.label.framework.openLabelXml(getAddressLabelXml());
      // }, "text");
    }

    // loads all supported printers into a combo box 
    function loadPrinters() {
      var printers = dymo.label.framework.getLabelWriterPrinters();
      if (printers.length == 0) {
        alert("No DYMO LabelWriter printers are installed. Install DYMO LabelWriter printers.");
        return;
      }

      for (var i = 0; i < printers.length; ++i) {
        var printer = printers[i];
        var printerName = printer.name;

        var option = document.createElement('option');
        option.value = printerName;
        option.appendChild(document.createTextNode(printerName));
        printersSelect.appendChild(option);
      }
    }

    // prints the label
    printButton.onclick = function() {
      try {
        if (!label)
          throw "Label is not loaded";

        if (!labelSet)
          throw "Label data is not loaded";

        label.print(printersSelect.value, '', labelSet);

        //                var records = labelSet.getRecords();
        //                for (var i = 0; i < records.length; ++i)
        //                {
        //                    label.setObjectText("Address", records[i]["Address"]);
        //                    var pngData = label.render();
        //
        //                    var labelImage = document.getElementById('img' + (i + 1));
        //                    labelImage.src = "data:image/png;base64," + pngData;
        //                }
      } catch (e) {
        alert(e.message || e);
      }
    };

    loadLabel();
    loadSpreadSheetData();
    loadPrinters();

  };

  function initTests() {
    if (dymo.label.framework.init) {
      //dymo.label.framework.trace = true;
      dymo.label.framework.init(onload);
    } else {
      onload();
    }
  }

  // register onload event
  if (window.addEventListener)
    window.addEventListener("load", initTests, false);
  else if (window.attachEvent)
    window.attachEvent("onload", initTests);
  else
    window.onload = initTests;

})();

DYMO.Label.Framework可在以下网址找到:

http://www.labelwriter.com/software/dls/sdk/js/DYMO.Label.Framework.2.0.2.js

我需要运行createLabelSet(json),因为它在循环中解析JSON,但似乎没有运行。我添加了一个日志条目:

console.log('starting to parse the JSON for the labels');

但是我没有在浏览器控制台中看到这一点。我对JavaScript很新,所以不太清楚为什么在加载页面时这个函数没有运行?

修改

将最后一行从}());更改为})();,但仍未在控制台中获取任何内容 - 而不是应显示的starting to parse the JSON for the labels条目。

1 个答案:

答案 0 :(得分:0)

您没有看到预期输出的原因是因为您的onload()函数从未被调用过。有几种方法可以在页面加载时运行该功能; this SO answer很好地描述了其中一些。

例如,将此行添加到代码中会在页面加载时执行onload()函数:

window.addEventListener("load", onload, false);

MDN有load protected void btninsert_Click(object sender, EventArgs e) { foreach (GridViewRow g1 in GridView1.Rows) { conStr = ConfigurationManager.ConnectionStrings["SqlConString"].ConnectionString; SqlConnection con = new SqlConnection(conStr); SqlCommand com = new SqlCommand("insert into MedicalItems (ITEM NAME,GROUP,ITEM TYPE,COST PRICE,SELLING PRICE,PURCHASE UOM,PURCHASE PACKAGING,DISPENSING UOM,QTY ON HAND,EXPIRY DATE,REORDER LEVEL,REORDER QUANTITY,BATCH#) values ('" + g1.Cells[0].Text + "','" + g1.Cells[1].Text + "','" + g1.Cells[2].Text + "','" + g1.Cells[3].Text + "','" + g1.Cells[4].Text + "','" + g1.Cells[5].Text + "','" + g1.Cells[6].Text + "','" + g1.Cells[7].Text + "','" + g1.Cells[8].Text + "','" + g1.Cells[9].Text + "','" + g1.Cells[10].Text + "','" + g1.Cells[11].Text + "','" + g1.Cells[12].Text + "','" + g1.Cells[13].Text + "')", con); con.Open(); com.ExecuteNonQuery(); con.Close(); } Label2.Text = "Records inserted successfully"; } 事件,如果您想阅读它。