Question

我有这个创建图像的功能：

<script>
domtoimage.toJpeg(document.getElementById('print_screen'), { quality: 0.70 })

              .then(function (dataUrl) {
                  var link = document.createElement('a');
                  link.download = 'invoice.jpeg';
                  link.href = dataUrl;
                  link.click();
});
</script>

问题是它在加载页面时立即启动。我想做一个按钮，如：

<a class="btn" href="" onclick="printFunction()">Click here to print</a>

我尝试将domtoimage包裹在function printFunction内，但这不起作用。我究竟做错了什么？：（

Answer 1

如果您正在使用jQuery，那么您可以将您的函数包装在document.ready函数中，如果不是，那么当浏览器解析该标记时，您的domtoimage.toJpeg函数将被执行。

<script>
$(document).ready(function(){
    var btnHandler = function(){
              domtoimage.toJpeg(document.getElementById('print_screen'), { quality: 0.70 })

              .then(function (dataUrl) {
                  var link = document.createElement('a');
                  link.download = 'invoice.jpeg';
                  link.href = dataUrl;
                  link.click();
    };
    var $btn = $("a.btn").click(btnHandler);
});
</script>

Answer 2

$（＆＃39; #butidid＆＃39;）。click（function（）{ 你的代码在这里 }）;

Answer 3

您正在触发承诺回调中的点击事件。解决方法是在promise回调中对link.click()进行评论，并触发另一个click event内的function

要这样做评论link.click()

<script>
    var link=null;
    domtoimage.toJpeg(document.getElementById('print_screen'), { quality: 0.70 })

                  .then(function (dataUrl) {
                      link = document.createElement('a');
                      link.download = 'invoice.jpeg';
                      link.href = dataUrl;
                      // Comment the below line
                      // link.click();
    });   
</script>

触发自定义函数中的click事件，如下所示：

<a class="btn" href="" onclick="printFunction()">Click here to print</a>

<script>
    function printFunction(){
        // trigger the click event in printFunction
        link.click();
    }
 </script>

Answer 4

函数中的

写下：

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

scriptElement.attr("src",the url of the jquery");

document.getElementsByTagName("BODY")[0].appendChild(scriptElement);

创建一个按钮来启动jQuery函数而不是立即启动它？

4 个答案: