Javascript 如何在不刷新的情况下在同一页面上显示上传的文件内容？
我有以下html和php代码来读取html页面中上传的文件，并在另一个新页面中显示其内容，但我希望在不打开新选项卡和刷新的情况下在同一html页面中显示文件内容，我如何实现这一点 HTML:Javascript 如何在不刷新的情况下在同一页面上显示上传的文件内容？,javascript,php,html,ajax,Javascript,Php,Html,Ajax,我有以下html和php代码来读取html页面中上传的文件，并在另一个新页面中显示其内容，但我希望在不打开新选项卡和刷新的情况下在同一html页面中显示文件内容，我如何实现这一点 HTML: <html> <body> <form action="upload_file.php" method="post" enctype="multipart/form-data"> <lab
<html>
<body>
<form action="upload_file.php" method="post"
enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file"><br>
<input type="submit" name="submit" value="Submit">
</form>
</body>
</html>
文件名：
<?php
if ($_FILES["file"]["error"] > 0)
{
echo "Error: " . $_FILES["file"]["error"] . "<br>";
}
else
{
echo "Upload: " . $_FILES["file"]["name"] . "<br>";
echo "Type: " . $_FILES["file"]["type"] . "<br>";
echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
echo "Stored in: " . $_FILES["file"]["tmp_name"];
}
?>
<?php
if ($_FILES["file"]["error"] > 0)
{
echo "Error: " . $_FILES["file"]["error"] . "<br>";
}
else
{
echo "Upload: " . $_FILES["file"]["name"] . "<br>";
echo "Type: " . $_FILES["file"]["type"] . "<br>";
echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
echo "Stored in: " . $_FILES["file"]["tmp_name"]. " <br>";
$content = file_get_contents($_FILES["file"]["tmp_name"]);
echo "Content: ".$content;
}
?>
您可以使用php检查是否单击了提交按钮，然后继续显示数据 PHP:upload.PHP
<?php
//checks if the submit button is submitted
if(isset($_POST['submit']) && $_POST['submit'] == "Submit") {
if ($_FILES["file"]["error"] > 0) {
echo "Error: " . $_FILES["file"]["error"] . "<br>";
}
else {
echo "Upload: " . $_FILES["file"]["name"] . "<br>";
echo "Type: " . $_FILES["file"]["type"] . "<br>";
echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
echo "Stored in: " . $_FILES["file"]["tmp_name"];
}
}
?>
<html>
<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file"><br>
<input type="submit" name="submit" value="Submit">
</form>
</body>
</html>
文件名：
<html>
<body>
<script>
function ajaxFileUpload(upload_field)
{
var filename = upload_field.value;
upload_field.form.action = 'upload_file.php';
upload_field.form.target = 'upload_iframe';
upload_field.form.submit();
return true;
}
</script>
<iframe name="upload_iframe" id="upload_iframe" ></iframe>
<form action="#" method="post" enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file" onchange="return ajaxFileUpload(this);">
</form>
</body>
</html>
函数ajaxFileUpload（上载字段）
{
var filename=upload_field.value；
upload_field.form.action='upload_file.php'；
upload_field.form.target='upload_iframe'；
upload_field.form.submit（）；
返回true；
}
文件名：
<?php
if ($_FILES["file"]["error"] > 0)
{
echo "Error: " . $_FILES["file"]["error"] . "<br>";
}
else
{
echo "Upload: " . $_FILES["file"]["name"] . "<br>";
echo "Type: " . $_FILES["file"]["type"] . "<br>";
echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
echo "Stored in: " . $_FILES["file"]["tmp_name"];
}
?>
<?php
if ($_FILES["file"]["error"] > 0)
{
echo "Error: " . $_FILES["file"]["error"] . "<br>";
}
else
{
echo "Upload: " . $_FILES["file"]["name"] . "<br>";
echo "Type: " . $_FILES["file"]["type"] . "<br>";
echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
echo "Stored in: " . $_FILES["file"]["tmp_name"]. " <br>";
$content = file_get_contents($_FILES["file"]["tmp_name"]);
echo "Content: ".$content;
}
?>