如何覆盖<；输入类型="；文件"。。。使用Javascript_Javascript_Jquery_Forms

如何覆盖<；输入类型="；文件"。。。使用Javascript

javascript jquery forms

如何覆盖<；输入类型="；文件"。。。使用Javascript,javascript,jquery,forms,Javascript,Jquery,Forms,在服务器上录制图像时，我需要在客户端调整图像大小并覆盖的内容，但出于安全原因，您不能这样做检查，以及只读属性无法更改。是否可以创建一个文件？如果没有手动用户操作，您永远无法提交文件（按提交按钮） <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="h

在服务器上录制图像时，我需要在客户端调整图像大小并覆盖的内容，但出于安全原因，您不能这样做

检查，以及

只读属性无法更改。

是否可以创建一个文件？如果没有手动用户操作，您永远无法提交文件（按提交按钮）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>change input file</title>

</head>
<body>

<br />
<form method="post" action="kontrola.php" enctype="multipart/form-data">
<input type="file" name="obr1" id="idobr1" onchange="handleFiles()" /><br /><br />
<img src="" id="image_obr1" /><!-- here is perspective view  -->
<br /><br /><br /><br />
<input type="submit" name="odoslat" value="ODOSLAT" /><br />

</form>



<script>

function handleFiles()
{
    var filesToUpload = document.getElementById('idobr1').files;
    var file = filesToUpload[0];

    var img = document.createElement("img"); // Create an image
    var reader = new FileReader();           // Create a file reader
    reader.onload = function(e)              // Set the image once loaded into file reader
    {
        img.src = e.target.result;

        var canvas = document.createElement("canvas");
        var ctx = canvas.getContext("2d");
        ctx.drawImage(img, 0, 0);

        var MAX_WIDTH = 421;
        var MAX_HEIGHT = 316;
        var width = img.width;
        var height = img.height;

        if (width > height) {
          if (width > MAX_WIDTH) {
            height *= MAX_WIDTH / width;
            width = MAX_WIDTH;
          }
        } else {
          if (height > MAX_HEIGHT) {
            width *= MAX_HEIGHT / height;
            height = MAX_HEIGHT;
          }
        }
        canvas.width = width;
        canvas.height = height;
        var ctx = canvas.getContext("2d");
        ctx.drawImage(img, 0, 0, width, height);

        var dataurl = canvas.toDataURL("image/jpg");
        document.getElementById('image_obr1').src = dataurl;     
    }
    // Load files into file reader
    reader.readAsDataURL(file);
}
</script>


</body>
</html>

<?php

// kontrola.php

if (isset($_POST['odoslat'])) {

    $chyba1='';

    $chyba1 = $_FILES['obr1']['size'];
    echo 'velkost = ' ,$chyba1 . '<br /><br />'; // here should be new resized image

}

?>