Php 上传多个文件并使用JCrop裁剪它们的方法？_Php_Html_Image_Jcrop

Php 上传多个文件并使用JCrop裁剪它们的方法？

php html image

Php 上传多个文件并使用JCrop裁剪它们的方法？,php,html,image,jcrop,Php,Html,Image,Jcrop,我有一个应用程序，我可以上传一张图片，裁剪它，然后保存它我想上传多个文件（输入类型为multiple），然后裁剪选定的图像所以，我现在的工作是完美的，但我想上传超过1 index.php： <!DOCTYPE> <html> <head> <title>Het Vergeet-mij-nietje</title> <link href="style/default.css" REL="stylesheet"

我有一个应用程序，我可以上传一张图片，裁剪它，然后保存它

我想上传多个文件（输入类型为multiple），然后裁剪选定的图像

所以，我现在的工作是完美的，但我想上传超过1

index.php：

<!DOCTYPE>
<html>

<head>
    <title>Het Vergeet-mij-nietje</title>
    <link href="style/default.css" REL="stylesheet" TYPE="text/css">
    <script type="text/javascript" src="js/showfunctie.js"></script>
    <script src="js/jquery.min.js"></script>
    <script src="js/jquery.Jcrop.min.js"></script>
    <link rel="stylesheet" href="css/jquery.Jcrop.css" type="text/css" />
</head>

<body>
<center>
    <div id="title">
    <h1><a href="index.php" id="link1">Het "Vergeet-mij-nietje"</a></h1>
    <h3>Upload Systeem</h3>
    </div>

<div id="content1">
    <p><b>Upload hier een afbeelding en druk op upload om hem vervolgens te kunnen bijsnijden.</b></p>
<form action="uploaded.php" method="post" enctype="multipart/form-data" onsubmit="return checkCoords();">
    <input type="file" name="filename" />
    <input type="submit" value="Upload" />
</form>:
<br /> <br />

<p align="left"><b>Bekijk hier de gecropte en geuploadde foto's</b></p>


    <p class="album">
        <?php include 'album.php';?>
    </p>

</div>

<div id="copyright">
Copyright &copy; Kees Sonnema & Jan Beetsma
</div>

</body>
</html>


他是我的朋友
上传系统
上传你的作品，上传你的作品
:



在上传到foto的文件时，将文件归档


版权及副本；Kees Sonnema&Jan Beetsma

http://www.php:

<!DOCTYPE>
<html>

<head>
    <title>Het Vergeet-mij-nietje</title>
    <link rel="stylesheet" href="style/default.css" type="text/css" />
    <script src="js/jquery.min.js"></script>
    <script src="js/jquery.Jcrop.min.js"></script>
    <link rel="stylesheet" href="style/css/jquery.jcrop.css" type="text/css" />

<script language="Javascript">
  // dit is de functie voor het croppen
            $(function(){

                $('#cropbox').Jcrop({
                    aspectRatio: 0,
                    onSelect: updateCoords,
                    bgColor: 'lightblue',
                    boxWidth: 600,
                    bgOpacity: .3,
                });

            });

            function updateCoords(c)
            {
                $('#x').val(c.x);
                $('#y').val(c.y);
                $('#w').val(c.w);
                $('#h').val(c.h);
            };

            function checkCoords()
            {
                if (parseInt($('#w').val())) return true;
                alert('Select where you want to Crop.');
                return false;
            };

        </script>
</head>
<body>
    <center>
        <div id="title">
        <h1><a href="index.php" id="link1">Het "Vergeet-mij-nietje"</a></h1>
        <h3>Upload Systeem</h3>
        </div>



     <div id="content1">
         <?php 
             session_start();
             $target = "data/uploads/"; 
             $target = $target . basename( $_FILES['filename']['name']) ; 
             $_SESSION['target_path'] = $target;

             $ok=1; 
             if(move_uploaded_file($_FILES['filename']['tmp_name'], $target)) 
             {
             echo "De afbeelding *". basename( $_FILES['filename']['name']). "* is geupload naar de map 'uploads'";
             } 
             else {
             echo "Sorry, er is een probleem met het uploaden van de afbeelding.";
             }
        ?> 
     <br /> <br />
    <center>
     <img id="cropbox" src="<?php echo $target ?>" />
    </center>
        <form action="crop.php" method="post" enctype="multipart/form-data">
            <input type="hidden" id="x" name="x" />
            <input type="hidden" id="y" name="y" />
            <input type="hidden" id="w" name="w" />
            <input type="hidden" id="h" name="h" />
            <input type="submit" value="Crop" />
        </form>

     <br /> <br />

     <a href="index.php">Ga terug naar de uploadpagina.</a>
    </div>

     <div id="copyright">
    Copyright &copy; Kees Sonnema
    </div>
</body>
</html>


他是我的朋友
//这是一个很好的例子
$（函数（）{
$（'#cropbox'）.Jcrop({
方面：0，
onSelect:updateCoords，
bgColor:'浅蓝色'，
箱宽：600，
不透明度：.3，
});
});
函数updateCoords（c）
{
$（'#x'）.val（c.x）；
$（'y'）.val（c.y）；
$（'w'）.val（c.w）；
$（'h'）.val（c.h）；
};
函数checkCoords（）
{
if（parseInt（$（'#w'）.val（））返回true；
警报（'选择要裁剪的位置'）；
返回false；
};
上传系统
使用此库如何：
jcrop似乎仅限于一次处理一个图像。让用户上传他们所有的图片，然后一次一张地展示给用户进行裁剪？哦，我不知道JCrop一次只能有一张图片。但首先我想上传4张图片。然后我想一次一个地把它们种下来。还有其他人知道路吗？
<!DOCTYPE>
<html>
<head>
    <title>Cropped Image</title>
</head>
<body>

<?php
SESSION_start();
if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
$jpeg_quality = 100;

$src = $_SESSION['target_path'];
$img_r = imagecreatefromjpeg($src);
$dst_r = imagecreatetruecolor($_POST['w'], $_POST['h']);

imagecopy(
    $dst_r, $img_r,
    0, 0, $_POST['x'], $_POST['y'],
    $_POST['w'], $_POST['h']
);

header('Content-type: image/jpeg');
imagejpeg($dst_r, 'data/uploads/' . basename($src));
header('Location:'.$src);
exit;
}
?>

</body>
</html>