Question

美好的一天！我很难用我的一个html表单来获取上传图片的字段。我想要做的是能够选择一个文件（图像）并使用ajax将其发送到php文件而不提交整个表单。如何在我的主表单中添加此文件类型的其他表单？

所以，例如我有这种形式：

<form action="submit.php" method="POST" >
<input type="text" name="title" />
<input type="text" name="descriptin" />
<input type="file" name="images" onchange="save_img()" id="file" />
</form>

现在我希望能够填写此表单，在我选择一张图片之后，我希望我的javascript使用ajax将图片发送到php文件并在我单击提交按钮之前以此形式显示它。我希望能够为此表单选择多个图像。我的Javascript看起来像这样：

function save_img()
{
var data = new FormData();
jQuery.each(jQuery('#file')[0].files, function(i, file) {
    data.append('file-'+i, file);
});
jQuery.ajax({
    url: '/admin/ajax/upload.php',
    data: data,
    cache: false,
    contentType: false,
    processData: false,
    type: 'POST',
    success: function(data){
        alert(data);
    }
});
}

但它不起作用。有人可以帮我一个简单的例子吗？谢谢！

PHP代码：

<?php
define('AJAX_REQUEST', isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest');
if(!AJAX_REQUEST) {die();}
require_once("../classes/admin.Class.php");
// Checking nline status
$Admin = new Admin;
$Admin -> OnLine();
$link = 'www.'.$_SERVER['SERVER_NAME'];
$name = time().'-'.$_FILES['file']['name'];
$extension = strtolower(substr($name, strpos($name, '.') + 1));
$type = $_FILES['file']['type'];
$size = $_FILES['file']['size'];
$max_size = 20097152;
$tmp_name = $_FILES['file']['tmp_name'];
if(strlen($_FILES['file']['name'])>34)
    exit('Image name must contain less than 30 characters!');
if(isset($name)) {
    if(!empty($name)) {
        if(($extension=='jpg'||$extension=='jpeg')&&($type=='image/jpeg'||$type='image/jpg')&&$size<=$max_size) {
            //picture location
            $location = '../../upload/foto/';
            if(move_uploaded_file($tmp_name, $location.$name)) {
                $size = getimagesize($location.$name);
                if($size[0]>550){
                    $ratio = $size[0]/$size[1]; // width/height
                    if( $ratio > 1) {
                        $width = 550;
                        $height = 550/$ratio;
                    }
                    else {
                        $width = 550*$ratio;
                        $height = 550;
                    }
                    $new_image = imagecreatetruecolor($width,$height);
                    $image_source = imagecreatefromjpeg($location.$name);
                    imagecopyresampled($new_image, $image_source, 0, 0, 0, 0, $width, $height, $size[0], $size[1]);
                    imagejpeg($new_image,$location.$name,100);
                    imagedestroy($new_image);
                    imagedestroy($image_source);
                }
                $db = new Connect;
                $user_id = $db->prepare("SELECT id FROM vr_users WHERE id=:id");
                $user_id -> execute(array(
                    'id' => intval($_COOKIE['check'])
                ));
                $check = $user_id->fetch(PDO::FETCH_ASSOC);
                $user_id = $check['id'];
                $insert = $db->prepare("INSERT INTO vr_images SET id_post=0, link=:link, 
                id_user=:id_user");
                $insert -> execute(array(
                        'link'      => '/upload/foto/'.$name,
                        'id_user'   => $user_id
                ));
                echo "<div class='alerta_upload_index'><img src='/upload/ok.png' /><br/>Your image was uploaded successfully!<br />
                <strong>http://$link/upload/foto/$name</strong></div>";
                $images=$db->prepare("SELECT id, link FROM vr_images 
                WHERE id_user=:id_user AND id_post=:id_post ORDER BY id DESC");
                $images -> execute(array(
                        'id_user' => $user_id,
                        'id_post' => 0
                ));
                while ($check = $images->fetch(PDO::FETCH_ASSOC))
                {
                    $dimensiune = getimagesize('../../'.$check['link']);
                    echo "<div class='fisier_incarcat'>
                            <div class='info_fisier'>
                                $dimensiune[0] x $dimensiune[1] - <a onclick='delete_img(".$check['id'].");' style='cursor:pointer'>[x]</a>
                            </div>
                            <img style='width:auto;height:auto;max-width:100px;max-height:90px;' src='".$check['link']."' />
                        </div>";
                }
            } else {
                echo "Eroare";
            }
        } else {
            echo "<div class='alerta_upload_eroare'>Your file should be a jpg/jpeg picture and less than 2 MB!</div>";
        }
    } else {
        echo "Please, choose a file!";
    }
}else {
    echo "Error!";
}
?>

具有多个字段的html表单中的文件上载字段，仅对一个字段使用ajax

0 个答案: