javascript - 关于图像文件的 php 和 javascript 中的 Ajax 代码

Question

我正在尝试通过签名板保存图像文件。我希望文件名是我的 div 中的一个元素。相应地发生变化。这是我的代码。它正在保存图像，但文件名是blank(.png).

Javascript：

$("#btnSaveSign").click(function(e){
        html2canvas([document.getElementById('sign-pad')], {
            onrendered: function (canvas) {
                var canvas_img_data = canvas.toDataURL('image/png');
                var img_data = canvas_img_data.replace(/^data:image\/(png|jpg);base64,/, "");
                var p = document.getElementById('my_class').innerHtml;
                //ajax call to save image inside folder
                $.ajax({
                    url: 'save_sign.php',
                    data: [{ img_data:img_data, p:p}],
                    type: 'post',
                    dataType: 'json',
                    success: function (response) {
                       window.location.reload();
                    }
                });
            }
        });
    });

save_sign.php：

<?php 
$result = array();
$imagedata = base64_decode($_POST['img_data']);
$filename = $_POST['p'];
//Location to where you want to created sign image
$file_name = './doc_signs/'.$filename.'.png';
file_put_contents($file_name,$imagedata);
$result['status'] = 1;
$result['file_name'] = $file_name;
echo json_encode($result);

?>

标签： javascriptphpajax

Answer 1

替换为您的作业var p = document.getElementById('my_class').value;