我正在尝试使用 PHP 和 javascript 在同一页面上上传图像文件。我在 PHP 中嵌入了 javascript 代码，以在 html 标记内显示一些消息和图像。下面是我的代码，请指出哪里做错了并纠正。 任何帮助，将不胜感激。 谢谢..
ImageUpload.php
if( isset($_POST['submit']) ) {
$fileName = $_FILES['file']['name'];
$fileTmpName = $_FILES['file']['tmp_name'];
$fileSize = $_FILES['file']['size'];
$fileError = $_FILES['file']['error'];
$maxFileSize = 200000;
$fileExt = explode(".", $fileName);
$currFileExt = strtolower(end($fileExt));
$allowed = array('jpg', 'jpeg', 'png', 'gif');
if(in_array($currFileExt, $allowed) ){
if($fileSize < $maxFileSize) {
if($fileError == 0){
$uniqueFileName = uniqid('',true).".".$currFileExt;
move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/'.$uniqueFileName);
?>
<script type="text/javascript">
document.getElementById('image').setAttribute("src",<?= 'uploads/'.$uniqueFileName; ?>);
</script>
<?php
} else {
?>
<script type="text/javascript">
document.getElementById('imageHolder').innerHTML = "There is an error in uploading file";
</script>
<?php
}
} else {
?>
<script type="text/javascript">
document.getElementById('imageHolder').innerHTML = "fileSize should be atmost 500kb";
</script>
<?php
}
} else {
?>
<script type="text/javascript">
document.getElementById('imageHolder').innerHTML = "This type of file is not allowed";
</script>
<?php
}
}
?>
<!DOCTYPE>
<html lang="en">
<body>
<form action="<?= htmlspecialchars($_SERVER['PHP_SELF']); ?>"
method="post" enctype="multipart/form-data" id="form" >
<input type="file" name="file" id="file" />
<input type="submit" value="Upload Image" name="submit" id="submit" />
</form>
<p ><h2>Upload image here</h2></p>
<div id="imageHolder" style="height:200px;max-height:200px;max-
width:200px;width:200px;border:1px solid black;">
<img src="" id="image" style="height: 200px;width: 200px;"/>
</div>
</body>
</html>
最佳答案
要解决您的问题，请参阅 @u_mulder 答案，但在这种状态下使用 javascript 不是好方法，我建议您像这样更改代码
<?php
$error = ''; // add $error to hold error text
$image_url = ''; // add $image_url to hold image url
if( isset($_POST['submit']) ) {
$fileName = $_FILES['file']['name'];
$fileTmpName = $_FILES['file']['tmp_name'];
$fileSize = $_FILES['file']['size'];
$fileError = $_FILES['file']['error'];
$maxFileSize = 200000;
$fileExt = explode(".", $fileName);
$currFileExt = strtolower(end($fileExt));
$allowed = array('jpg', 'jpeg', 'png', 'gif');
if(in_array($currFileExt, $allowed) ){
if($fileSize < $maxFileSize) {
if($fileError == 0){
$uniqueFileName = uniqid('',true).".".$currFileExt;
move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/'.$uniqueFileName);
//this part updated
$image_url = 'uploads/'.$uniqueFileName;
} else {
// this part updated
$error = 'There is an error in uploading file';
}
} else {
// this part updated
$error = "fileSize should be atmost 500kb";
}
} else {
// this part updated
$error = "This type of file is not allowed";
}
}
?>
<!DOCTYPE>
<html lang="en">
<body>
<form action="<?= htmlspecialchars($_SERVER['PHP_SELF']); ?>"
method="post" enctype="multipart/form-data" id="form" >
<input type="file" name="file" id="file" />
<input type="submit" value="Upload Image" name="submit" id="submit" />
</form>
<p ><h2>Upload image here</h2></p>
<div id="imageHolder" style="height:200px;max-height:200px;max-
width:200px;width:200px;border:1px solid black;">
<?php
//this part updated
if($error):
?>
<p><?php echo $error; ?></p>
<?php
endif;?>
<?php
if($image_url): ?>
<img src="<?php echo $image_url; ?>" id="image" style="height: 200px;width: 200px;"/>
<?php
endif; ?>
</div>
</body>
</html>
关于javascript - 在同一页面上传图片文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45397696/