javascript - 每次我调用它的twig模板时执行javascript

Question

我有一个 php 脚本，它通过 for 循环调用另一个脚本。然后调用的脚本会回显一个 Twig 模板，该模板附加了一个可导出 pdf 的 JavaScript。问题是 JavaScript 只执行一次。流程如下:

generate-invoice.php ->invoice.php -> 具有脚本标签的 Twig 模板 -> 该 JavaScript 的代码是:

window.onload = function() {
  kendo.pdf.defineFont({
      "Comfortaa": "/doc/fonts/Comfortaa-Regular.ttf",
      "Comfortaa|Bold": "/doc/fonts/Comfortaa-Bold.ttf",
  });

  var inv_num = document.querySelector('#inv_num').dataset.id;
  var company = document.querySelector('#company').dataset.id;

  function ExportPdf(){ 
      kendo.drawing
      .drawDOM("#myCanvas", 
      {
      paperSize: "A4",
      margin: { top: "0.5cm", bottom: "0.5cm", left: "0.5cm", right: "0.5cm" 
},
      scale: 0.8,
      height: 500
      })
      .then(function(group){
      kendo.drawing.pdf.saveAs(group,company + " | Invoice #" + inv_num + 
".pdf")
      });
  }

  ExportPdf();
  console.log('It ran');
}

当我查看控制台时，“it ran”仅发布一次，而它应该发布两次，因为 Twig 模板被调用了两次。

编辑:只是想让您知道我正在通过将其包含在 for 循环中来调用发票.php 脚本。也许这就是导致此问题的原因？

Answer 1

要记录字符串两次或调用脚本的次数，请将语句移至 ExportPdf() 函数

从 window.inload 调用它只会运行一次，这是第一次加载窗口。

window.onload = function() {
  kendo.pdf.defineFont({
      "Comfortaa": "/doc/fonts/Comfortaa-Regular.ttf",
      "Comfortaa|Bold": "/doc/fonts/Comfortaa-Bold.ttf",
  });

  var inv_num = document.querySelector('#inv_num').dataset.id;
  var company = document.querySelector('#company').dataset.id;

  function ExportPdf(){ 
      kendo.drawing
      .drawDOM("#myCanvas", 
      {
      paperSize: "A4",
      margin: { top: "0.5cm", bottom: "0.5cm", left: "0.5cm", right: "0.5cm" 
      },
      scale: 0.8,
      height: 500
      })
      .then(function(group){
      kendo.drawing.pdf.saveAs(group,company + " | Invoice #" + inv_num + ".pdf")
      });
      //Moved here
      console.log('It ran');
  }

  ExportPdf();
}

编辑: window.onload 只会触发一次，除非浏览器刷新，否则永远不会触发。为了获得所需的结果，我建议您将该函数放置在 window.onload 之外。在这种情况下，在 HTML/JavaScript 代码中，您需要将调用模板的主函数包装在 .onload 中。