如何使用 Javascript/JQuery 截取当前网页的屏幕截图?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18231259/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 11:08:19  来源:igfitidea点击:

How to take screen shot of current webpage using Javascript/JQuery?

javascriptwebpage-screenshot

提问by user2682340

I was trying to take screen shot of a web page using JavaScript/JQuery. Could you please explain me the code steps I need to follow?

我试图使用 JavaScript/JQuery 截取网页的屏幕截图。你能解释一下我需要遵循的代码步骤吗?

回答by Edward

The html2canvas2JavaScript utility is suitable to take a screenshot of a webpage. You have to use three JavaScript libraries:

html2canvas2的JavaScript工具是适合于拍摄网页的屏幕截图。您必须使用三个 JavaScript 库:

 1.jquery-1.10.2.min.js
 2.html2canvas.js
 3.jquery.plugin.html2canvas.js

Then call the function capture(), which will give you an HTML5 canvas-based screenshot in new window. It also generates a base64data value of image. It only works in browsers that support HTML5 canvas.

然后调用函数 capture(),它将在新窗口中为您提供基于 HTML5 画布的屏幕截图。它还生成图像的 base64data 值。它仅适用于支持 HTML5 画布的浏览器。

    <script type="text/javascript">
    function capture() {
            html2canvas($('body'),{
                onrendered: function (canvas) {                     
                            var imgString = canvas.toDataURL("image/png");
                            window.open(imgString);                  
            }
        });
   </script>