如何使用两个浏览按钮和单个提交按钮上传两个不同的图像

时间:2018-05-31 18:13:46

标签: php html mysqli

我想使用一个使用mysqli的提交按钮上传两个图像,一个用户和一个他的ID。这是我的HTML。

<!DOCTYPE html>
<html>
<body>

<form action="/action_page.php">
  your image: <input type="file" name="img"><br/>
  your Id card: <input type="file" name="img2">
  <input type="submit" name="publish" value="upload">
</form>

</body>
</html>

我所知道的是一次上传单张图片,但如果想通过单次提交将这些图片上传到数据库中会怎么样。我不是在编写PHP,因为我不知道如何做到这一点。我可以使用数组一次上传多个图像,但我想使用此方法。可以用PHP吗?

单个上传的PHP:

<?php
$dir = "uploads/";
$t_file = $dir . basename($_FILES["img"]["name"]);
$uploadOk = 1;
$imageFileType = strtolower(pathinfo($t_file,PATHINFO_EXTENSION));

if(isset($_POST["upload"])) {
    $check = getimagesize($_FILES["img"]["tmp_name"]);
    if($check !== false) {
        echo "File is an image - " . $check["mime"] . ".";
        $uploadOk = 1;
    } else {
        echo "File is not an image.";
        $uploadOk = 0;
    }
}
?>

1 个答案:

答案 0 :(得分:1)

我可以使用javascript来做到这一点。所有受尊敬的用户,对于任何语言新手都会更有帮助。或者只为专家而不是初学者创建本网站。

所以我使用PHP进行首次上传,使用JS进行第二次图片上传。

这里是js:

<script>
function startUpload(){
document.getElementById('uploadProcess').style.visibility = 'visible';
document.getElementById('uploadForm').style.visibility = 'hidden';
return true;
}

function stopUpload(success,uploadedFile){
var result = '';
if (success == 1){
    result = '<span class="sucess-msg">The file was uploaded successfully!<\/span><br/><br/>';
    //Uploaded file preview
    var embed = document.getElementById("UploadedFile");
    var clone = embed.cloneNode(true);
    clone.setAttribute('src',uploadedFile);
    embed.parentNode.replaceChild(clone,embed);
}else {
   result = '<span class="error-msg">There was an error during file upload!<\/span><br/><br/>';
}
document.getElementById('uploadProcess').style.visibility = 'hidden';
document.getElementById('uploadForm').innerHTML = result + '<label>File:<input name="myfile" type="file" size="30" /><\/label><label><input type="submit" name="submitBtn" class="sbtn" value="Upload" /><\/label>';
document.getElementById('uploadForm').style.visibility = 'visible';      
return true;   
}
</script>

html:

<form action="upload.php" method="post" enctype="multipart/form-data" onsubmit="startUpload();">
 <p id="uploadForm">
 Select image to upload:
 <input type="file" name="fileToUpload" id="fileToUpload">
 <input type="file" name="myfile" id="fileToUpload1">
 <input type="submit" value="submitBtn" name="submit">
 </p>
</form>

和upload.php:

<?php
$success = 0;
$uploadedFile = '';

//File upload path
$uploadPath = 'uploads/';
$targetPath = $uploadPath . basename( $_FILES['myfile']['name']);

if(@move_uploaded_file($_FILES['myfile']['tmp_name'], $targetPath)){
    $success = 1;
    $uploadedFile = $targetPath;
}

sleep(1);
?>
<?php
$target_dir = "uploads/";
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
$uploadOk = 1;
$imageFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));

if(isset($_POST["submit"])) {
 $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
 if($check !== false) {
    echo "File is an image - " . $check["mime"] . ".";
    $uploadOk = 1;
 } else {
    echo "File is not an image.";
    $uploadOk = 0;
 }
}


if ($uploadOk == 0) {
 echo "Sorry, your file was not uploaded.";
// if everything is ok, try to upload file
} else {
if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
    echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded.";
} else {
    echo "Sorry, there was an error uploading your file.";
}
}
?>