如何在不刷新的情況下在同一頁面上顯示上傳的文件內容？

Question

我有以下html和php代碼，可在html頁面中讀取上載的文件，並在另一個新頁面中顯示其內容，但是我希望在同一html頁面中顯示文件內容，而無需打開新標簽並刷新，如何顯示實現那個？

HTML：

<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：upload_file.php

<?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"];
    }
?>

Answer 1

您可以使用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>

Answer 2

您可以使用iframe

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>

upload_file.php

 <?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; 
     }
   ?>

如何在不刷新的情況下在同一頁面上顯示上傳的文件內容？

問題描述

2 個解決方案

解決方案1
0 2013-09-19 18:02:34

解決方案2
0 已采納 2013-09-19 18:23:49

如何在不刷新的情況下在同一頁面上顯示上傳的文件內容？

問題描述

2 個解決方案

解決方案1 0 2013-09-19 18:02:34

解決方案2 0 已采納 2013-09-19 18:23:49

解決方案1
0 2013-09-19 18:02:34

解決方案2
0 已采納 2013-09-19 18:23:49