我想从我的 jsp 页面传递一个 url。它应该解析该页面，获取特定的 html div 并将 div 输出转换为图像并将其显示在我的页面上。
示例:我通过 www.google.com 并且我想在图像中转换的 div 的输出是
我为相同的“http://codepedia.info/convert-html-to-image-in-jquery-div-or-table-to-jpg-png/”获得了一个很好的 jQuery，但它只在本地页面上工作，不允许传递 URL
谁能帮忙解决这个问题。
最佳答案
@Pushkar Sharan you can do this with html2canvas just add some script like jquery-ui.css, jquery.js, jquery-ui.js, https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js then try to understand below code
<html>
<head>
<link href="jquery-ui.css" rel="stylesheet">
<script src="jquery.js"></script>
<script src="jquery-ui.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
<script>
$(window).load(function(){
$('#load').click(function(){ //calling this function when Save button pressed
html2canvas($('#cont'), {//give the div id whose image you want in my case this is #cont
onrendered: function (canvas) {
var img = canvas.toDataURL("image/png",1.0);//here set the image extension and now image data is in var img that will send by our ajax call to our api or server site page
$.ajax({
type: 'POST',
url: "http://localhost/my/index.php",//path to send this image data to the server site api or file where we will get this data and convert it into a file by base64
data:{
"img":img
},
success:function(data){
$("#dis").html(data);
}
});
}
});
});
});
</script>
</head>
<body>
<div id="cont">
</div><br>
<center><input type="button" value="Save" id="load"></center><br>
<div id="dis"></div>
</body>
</html>
现在服务器站点程序假设这是 index.php 所以
index.php
<?php
$img = $_POST['img'];//getting post img data
$img = substr(explode(";",$img)[1], 7);//converting the data
$target=time().'img.png';//making file name
file_put_contents('uploads/'.$target, base64_decode($img));//converting the $img with base64 and putting the image data in uploads/$target file name
//now just check in your upload folder you will get your html div image in that folder
?>
关于javascript - 在 jQuery 中将 HTML div 转换为图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38745988/