显示用ajax上传的txt文件的内容

时间:2013-10-15 16:59:02

标签: php jquery html ajax file-upload

我已经能够使用ajax将.txt文件上传到我的网站,但我也希望在我的网站上显示.txt文件的内容。我不知道该怎么做。谢谢!

这是我的HTML

<!DOCTYPE html>
<html>
    <head> 
            <script type="text/javascript" src="static/jquery-1.4.2.js"></script>
            <script type="text/javascript" src="static/jquery-ui-1.8.4.custom.min.js"></script>
            <script type='text/javascript' src='static/js_test.js'></script>
            <script type='text/javascript' src='static/jquery.form.js'></script> 

            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
            <script src="http://malsup.github.com/jquery.form.js"></script>
    </head>
    <body>    
            <form action="http://malsup.com/jquery/form/file-echo2.php" method="post" enctype="multipart/form-data">
                <input type="file" name="myfile"/>
                <input type="submit" value="Submit File"/>
            </form>



            <div class="progress">
                <div class="percent">0%</div >
            </div>

            <div id="status"></div>
    </body>
</html>

这是我的jquery

$(document).ready(function() {

(function() {

var bar = $('.bar');
var percent = $('.percent');
var status = $('#status');

$('form').ajaxForm({
    beforeSend: function() {
        status.empty();
        var percentVal = '0%';
        bar.width(percentVal)
        percent.html(percentVal);
    },
    uploadProgress: function(event, position, total, percentComplete) {
        var percentVal = percentComplete + '%';
        bar.width(percentVal)
        percent.html(percentVal);
    },
    success: function() {
        var percentVal = '100%';
        bar.width(percentVal)
        percent.html(percentVal);
    },
complete: function(xhr) {
    status.html(xhr.responseText);
}
}); 

})();       



});  

这是我的php

<?php
foreach($_FILES as $file) {
   $n = $file['name'];
    $s = $file['size'];
   if (is_array($n)) {
      $c = count($n);
      for ($i=0; $i < $c; $i++) {
         echo "<br>uploaded: " . $n[$i] . " (" . $s[$i] . " bytes)";
      }
   }
   else
      echo "<br>uploaded: $n ($s bytes)";
}
?>

2 个答案:

答案 0 :(得分:3)

您可以在ajax请求中将其发回:

在file-echo2.php中:

<?php

foreach($_FILES as $file) {
   $n = $file['name'];
   $s = $file['size'];

   if (is_array($n)) {
      $c = count($n);
      for ($i=0; $i < $c; $i++) {
         if (move_uploaded_file($n[$i], '/path/where/you/put/that/file.txt')) {
            echo "uploaded " . $n[$i] . " (" . $s[$i] . " bytes):\n";
            echo file_get_contents('/path/where/you/put/that/file.txt');
         }
      }
   }
   else {
      if (move_uploaded_file($n, '/path/where/you/put/that/file.txt')) {
            echo "uploaded " . $n . " (" . $s . " bytes):\n";
            echo file_get_contents('/path/where/you/put/that/file.txt');
      }
   }
}

答案 1 :(得分:-1)

var fileText = load('file_name.txt');

你可以通过这里找到更多解决方案: http://forum.jquery.com/topic/reading-values-from-text-file