PHP和JS - 上传图片不显示

（我有一天到PHP，所以请原谅，如果这是重复）我有代码上传图片到我的上传/目录在网站文件夹。这是通过下面给出的index.html和upload.php完成的，最初见于PHP - Upload picture and display on page。PHP和JS - 上传图片不显示

但是，我不能根据需要在html页面上显示图片。它重定向到upload.php，没有图像处理器。任何帮助如何做到这一点？我的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部分完成之前，它不再重定向。但是，图像仍然不显示。

来源

2017-07-25 Bhavna

你可以使用java脚本来做到这一点，但没有必要这样做。最简单的方法是用几行PHP。将您的文件的名称从index.html更改为index.php因此您可以在该文件中使用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>

此线将显示从上传文件夹中的所有图像：

在你的index.php文件你关闭你的表格后，添加以下代码。

所以，你有这样的事情：

<!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标记。此行将始终将您重定向到您的索引页面。

希望这对你有帮助！

来源

2017-07-25 17:43:22 Darko

在我看来，你正试图从你的upload.php调用你的“juploadstop”函数，它包含在你的JS中的index.html页面中。这是行不通的。如果你只是想上传并显示图片，你甚至不一定需要使用任何JS。只需为目标文件使用固定名称，删除JS，在index.html <img src="uploads/yourimage.jpg">中放置一个简单的图像标记，然后在您的PHP脚本的末尾放置一个header("Location: index.html");，因此一旦上传完成，用户将被定向回到索引页面。

来源

2017-07-25 15:12:06

非常感谢您的帮助！我想从_upload.php_ 和要上传的文件调用juploadstop，因此目标文件名取决于用户。我可以在处理中给它一个固定的名字吗？如果是，如何？ – Bhavna

PHP和JS - 上传图片不显示

回答

相关问题