使用dataURL发送变量

Hi I have this code that works sending a dataURL to php and saving it to the server.

JS:

function addFormText(){
$('body').append('<input type="hidden" name="img_val" id="img_val" value="" />');
}

function capture() {
$('.Canvas').html2canvas({
    onrendered: function (canvas) {
        //Set hidden field's value to image data (base-64 string)
        $('#img_val').val(canvas.toDataURL("image/png"));
        var myImage = $('#img_val').val();


        $.ajax({

            type:"POST",
            url: "php/save.php",
            data: $('#img_val').val(canvas.toDataURL("image/png")),
            success: function(){
            }
        });
    }
});
}

PHP

//Show the image
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.png', $unencodedData);
?>

What I'm having a problem with is sending another variable. When I try to do this the variable is uploaded but the dataURL is somehow broken the file is saved but is now 0B

JS:

            type:"POST",
            url: "php/save.php",
            data: $('#img_val').val(canvas.toDataURL("image/png"))+"&random="+random,
            success: function(){

PHP

<?php
//save.php code

$random = $_REQUEST['random'];

//Show the image
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($random.'img.png', $unencodedData);
?>

Does anybody know why?

Try this:

        type:"POST",
        url: "php/save.php",
        data: {
            img_val: canvas.toDataURL("image/png"),
            random: random
        },
        success: function(){

$_POST contains img_val and random keys