Question

（我对php有一天的时间，请原谅，如果重复的话）我有代码将图像上传到网站文件夹中的uploads /目录。这是通过下面给出的index.html和upload.php完成的，最初来自PHP - Upload picture and display on page。

但是，我无法根据需要在html页面上显示图片。它重定向到upload.php，没有imageholder。有什么帮助怎么做？我的index.html工作正常，所以我猜我的PHP设置应该没问题。我按照this，this和this来安装和设置所有内容。

的index.html

<!DOCTYPE html>
<html>
<head>
<script language= "javascript" type="text/javascript">
function juploadstop(result){
    console.log(typeof result);
    if(result==0){
        $(".imageholder").html("");
    }
    else if(result!=0){
        $(".imageholder").html("<img src='"+result+"'>");
    }
}
</script>
</head>

<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
    <div class="imageholder"> <!-- a gif image to show that the process wasn't finished -->
    </div>
    Select image to upload:
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" value="Upload Image" name="submit">
</form>
</body>
</html>

和 upload.php

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

// Check if image file is a actual image or fake image
if(isset($_POST["submit"])) {
    $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
    if($check !== false) {
        $uploadOk = 1;
    } else {
        $uploadOk = 0;
    }
}

if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg") {
    // echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
    $uploadOk = 0;
}


if ($uploadOk == 0) {
    // echo "Sorry, your file was not uploaded.";
} else {
    if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
        $result = $target_file;
    } else {
        $result = 0;
    }
}
?>

<script language="javascript" type="text/javascript">
    window.top.window.juploadstop(<?php echo $result; ?>);
</script>

编辑1 我添加了

header("Location: index.html");

在php部分完成之前，我的php代码结束了，它不再重定向了。但是，图像仍然无法显示。

Answer 1

您可以使用java脚本执行此操作，但不需要这样做。最简单的方法是使用几行PHP。将文件名称从 index.html 更改为 index.php ，以便在该文件中使用PHP。

在 index.php 文件中，关闭表单后添加以下代码：

<br>
HERE ARE YOUR UPLOADED IMAGES:
<br>
<?php
$dirname = "uploads/";

$images = glob($dirname."*{jpg,png,gif}", GLOB_BRACE);

foreach($images as $image) {
    echo '<img src="'.$image.'" /><br />';
}
?>

<br>

此行将显示uploads文件夹中的所有图像。

所以你会有这样的事情：

<!DOCTYPE html>
<html>
<head>
<script language= "javascript" type="text/javascript">
function juploadstop(result){
    console.log(typeof result);
    if(result==0){
        $(".imageholder").html("");
    }
    else if(result!=0){
        $(".imageholder").html("<img src='"+result+"'>");
    }
}
</script>
</head>

<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
    <div class="imageholder"> <!-- a gif image to show that the process wasn't finished -->
    </div>
    Select image to upload:
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" value="Upload Image" name="submit">
</form>
<br>
HERE ARE YOUR UPLOADED IMAGES:
<br>
<?php
$dirname = "uploads/";

$images = glob($dirname."*{jpg,png,gif}", GLOB_BRACE);

foreach($images as $image) {
    echo '<img src="'.$image.'" /><br />';
}
?>

<br>

</body>
</html>

您还需要在最后添加 upload.php 文件：

header('Location: index.php');

确保在关闭PHP标记之前添加此标记。此行将始终在索引页面上重定向。

希望这对你有所帮助！

Answer 2

在我看来，你正试着打电话给你的＆＃34; juploadstop＆＃34;函数，包含在index.html页面的JS中，来自upload.php。那不行。如果您只想上传并显示图片，您甚至不需要使用任何JS。只需为目标文件使用固定名称，删除JS，在index.html <img src="uploads/yourimage.jpg">中放置一个简单的图像标记，然后在PHP脚本的末尾添加header("Location: index.html");，这样一旦上传已处理完的用户将被定向回索引页面。

PHP和JS - 上传的图片没有显示

2 个答案: