Quelltext dieser Webseite

  1. <!DOCTYPE html>
  2. <html>  
  3.     <head>  
  4.         <title>TEST</title>  
  5.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>  
  6.         <meta http-equiv="Content-Language" content="de"/>  
  7.         <meta http-equiv="expires" content="0"/>  
  8.         <script type="text/javascript">
  9.             function checksizes(datei){
  10.                 // Wenns der IE ist, können wir nix machen und müssen das Formular absenden
  11.                 // So wird durch den IE unnötiger Traffic erzeugt und der User rennt ins offene Messer
  12.                 if(navigator.appName.indexOf("Internet Explorer") != -1){
  13.                     return true;
  14.                 }
  15.                
  16.                                 // Bist du ein Opera?
  17.                 var opera = (navigator.userAgent.indexOf('Opera') != -1);
  18.                
  19.                 // erst einmal ist alles schön
  20.                 var result = true;
  21.                
  22.                 // Die Maximalgrößen
  23.                 var mb2 = 2 * 1024 * 1024;
  24.                 var mb5 = 5 * 1024 * 1024;
  25.                 var mb8 = 8 * 1024 * 1024; // post_max_size
  26.                 var maxfilesize = mb2;
  27.                 var maxpostsize = mb8;
  28.                
  29.                 var postsize = 0;
  30.                 var filesize = 0;
  31.                 var filename = '';
  32.                
  33.                 // Die Statusausgabe
  34.                 var ausgabe = document.getElementById('ausgabe');
  35.                 // Zuerst die Ausgabe löschen
  36.                 ausgabe.innerHTML = '';
  37.  
  38.                 // Wir gehen alle files durch. Nur mit HTML5 (außer IE) sind multiple Fileuploads möglich.
  39.                 // Bei HTML4, XHTML usw. stehen die Daten zu dem einzigen File in files[0]
  40.                 for(i=0; i < datei.files.length; i++){
  41.                     filesize = (opera) ? datei.files[i].size : datei.files[i].fileSize;
  42.                     postsize += filesize;
  43.                     if(filesize <= maxfilesize){
  44.                         var uploadstatus = '<span style="color:#00a000">OK</span>';
  45.                     }else{
  46.                         var uploadstatus = '<span style="color:#f00000">Zu Groß!</span>';
  47.                         // delete datei.files[i]; // Das funktioniert leider nicht, weil wir mit Javascript keinen Schreibzugriff auf die files[] im datei Objekt haben
  48.                         // Deshalb müssen wir schon bei nur einem zu großen File abbrechen!
  49.                         result = false;
  50.                        
  51.                     }
  52.  
  53.                     filename = (opera) ? datei.files[i].name : datei.files[i].fileName;
  54.                     // Den Dateistatus in die Ausgabe schreiben
  55.                     ausgabe.innerHTML += '<p>Datei: ' + filename + ' - Status: ' + uploadstatus + '</p>\n<hr>\n'
  56.                 }
  57.                
  58.                 // noch prüfen, ob die post_max_size nicht überschritten wurde
  59.                 if(postsize > maxpostsize){
  60.                     result = false;
  61.                     ausgabe.innerHTML += '<p style="color:#f00000;">Die Gesamtgröße aller Dateien beträgt: ' + postsize + 'byte<br>Maximale Gesamtgröße ist: ' + maxpostsize + 'byte</p>\n<hr>\n'
  62.                 }
  63.                 // true = der onclick Event wird weitergegeben und vom SUbmitbutton ausgeführt
  64.                 // false = der onclick Event wird abgebrochen und vom Submit Button nicht weiter verarbeitet, das Formular also nicht abgesendet.
  65.                
  66.                 return result;
  67.             }
  68.         </script>
  69.     </head>  
  70.     <body>  
  71.         <form action="./checkfilesize.html" method="post" enctype="multipart/form-data">
  72.        
  73.             <!-- Das Attribut "multiple" gibt es nur in HTML5 und wird *NICHT* vom IE unterstützt. Trotzdem hier zur Demonstration angewendet -->  
  74.             <input type="file" id="myfile" name="Datei" onchange="checksizes(document.getElementById('myfile'));" multiple>  
  75.  
  76.             <!-- Wir fangen den onclick Event ab und entscheiden dann ob wir ihn an den Submit Button weitergeben oder nicht. -->
  77.             <input type="submit" name="Senden" value="Senden" onclick="return checksizes(document.getElementById('myfile'));">
  78.         </form>
  79.         <div id="ausgabe"></div>
  80.  
  81.         <div class="sourcecode">
  82.             <h2>Quelltext dieser Webseite</h2>
  83.  
  84. <?php
  85. require_once('./Ixiter_Geshi.php');
  86. echo IxiterGeshi_parseCode(file_get_contents(__FILE__));
  87. ?>
  88.  
  89.         </div>
  90. <?php include('./piwik.php') ?>
  91.     </body>  
  92. </html>
  93.  
  94.  
(Sourcecode highlighting by Ixiters Hilighter)