HTML2CANVAS通过$ _POST

Question

我通过html2canvas和jquery：

渲染了一个图像

<script>
    function capture() {
        console.log("function is running");
        jQuery('#square').html2canvas({
            onrendered: function(canvas) {
                var url;
                url = canvas.toDataURL("image/png");
                //Set hidden field's value to image data (base-64 string)
                jQuery('#img_val').val(canvas.toDataURL("image/png"));
                //Submit the form manually
                //var myImage = canvas.toDataURL("image/png");
                window.open(url);
                jQuery("#myForm").submit();
                console.log(jQuery('#img_val').val());
            }
        });
    }
</script>

代码工作正常，我通过window.opne看到图像。

我遇到的问题是，当我提交表单时，保持图像值未通过。我知道它的设置是因为我通过控制台看到了它。

我的表格：

<input type="submit" value="Take Screenshot Of Div" onclick="capture();" />
<form method="POST" enctype="multipart/form-data" action="/save.php" id="myForm">
    <input type="hidden" name="img_val" id="img_val" value="" />
</form>

我的Save.php

<?php
//save.php code

//Show the image
var_dump($_POST['img_val']);
echo 'Billede:<br />';
echo '<img src="'.$_POST['img_val'].'" />';

//Get the base-64 string from data
$filteredData=substr($_POST['img_val'], strpos($_POST['img_val'], ",")+1);

//Decode the string
$unencodedData=base64_decode($filteredData);

//Save the image
file_put_contents('img' . rand(0,10000) . '.png', $unencodedData);
?>

为什么渲染图像的值不是通过我的表单传递的 - 当我知道我是通过jQuery设置的时候？