suchen

Heim >Web-Frontend >js-Tutorial >Welche Schritte sind erforderlich, um die Art und Größe der hochgeladenen Bilder zu bestimmen?

Welche Schritte sind erforderlich, um die Art und Größe der hochgeladenen Bilder zu bestimmen?

php中世界最好的语言
php中世界最好的语言Original
2018-04-28 15:13:111914Durchsuche

Dieses Mal werde ich Ihnen die Schritte vorstellen, die zur Bestimmung der Art und Größe der hochgeladenen Bilder erforderlich sind, und welche Vorsichtsmaßnahmen zur Bestimmung der Art und Größe der hochgeladenen Bilder gelten Sind praktische Fälle, schauen wir uns das gemeinsam an. Schauen Sie mal rein. z

Hier verwenden wir jQuery, um den Typ und die Größe des hochgeladenen Bildes zu bestimmen: Die Methode 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<form action="" method="">
  <input type="file" id="file" />
</form>
<p id="p_1">图片格式为：</p>
<p id="p_2">图片大小为：</p>
<script src="js/jquery-1.8.3.min.js"></script>
<script>
$(function(){
  var p_1 = $('#p_1'),
    p_2 = $('#p_2');
  $('body').on('change','#file',function(){
    var path = $(this).val(),
    extStart = path.lastIndexOf('.'),
    ext = path.substring(extStart,path.length).toUpperCase();
    //判断图片格式
    if(ext !== '.PNG' && ext !== '.JPG' && ext !== '.JPEG' && ext !== '.GIF'){
      alert('请上传正确格式的图片');
      resetFile();
      return false;
    }else{
      p_1.html('图片格式为：' + ext);
    }
    //获取图片大小，注意使用this，而不是$(this)
    var size = this.files[0].size / 1024;
    if(size > 10240){
      alert('图片大小不能超过10M');
      resetFile();
      return false;
    }else{
      p_2.html('图片大小为：' + size.toFixed(2) + 'KB');
    }
  })
  //还原
  function resetFile(){
    //清空file表单的值，不能直接使用$('#file').val('')这种写法
    $('form').html('<input type="file" id="file" />');
    p_1.html('图片格式为：');
    p_2.html('图片大小为：');
  }
})
</script>
</body>
</html>

lastIndexOf() ruft den angegebenen String ab von hinten nach vorne. Wenn das angegebene Zeichen erscheint, geben Sie die Position des Zeichens zurück. Wenn nicht, geben Sie -1 zurück und die Position beginnt bei 0 zu zählen.

toUpperCase() Methode konvertiert in Großbuchstaben

substring() Die Methode fängt die Zeichenfolge ab. Der erste Parameter ist die Endposition (wenn er weggelassen wird, wird standardmäßig das Ende der Zeichenfolge abgefangen). und slice()-Methoden, substr()Akzeptiert keine negativen Parametersubstring()

Die Methode ist die gleiche wie die slice()-Methode, der Unterschied besteht darin, dass sie negative Parameter akzeptiert (wenn der Parameter negativ ist). Zahl, die Position wird ab dem Ende der Zeichenfolge berechnet)substring()

Methode fängt eine Zeichenfolge ab. Der erste Parameter ist die Startposition und der zweite Parameter ist die abgefangene Länge (anders als Slice und Teilzeichenfolge). . Es wird nicht mehr empfohlen, substr()

zu verwenden. Ich glaube, ich habe den Fall in diesem Artikel gelesen. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website.

Empfohlene Lektüre:

Detaillierte Erläuterung der Konstruktionsschritte des Koa-Projekts

Angular6.0 implementiert die Funktion zum verzögerten Laden von Komponenten (mit Code)

Das obige ist der detaillierte Inhalt vonWelche Schritte sind erforderlich, um die Art und Größe der hochgeladenen Bilder zu bestimmen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Welche Schritte sind erforderlich, um Vue für die Anforderung lokaler JSON-Daten zu konfigurieren?Nächster Artikel：Welche Schritte sind erforderlich, um Vue für die Anforderung lokaler JSON-Daten zu konfigurieren?

In Verbindung stehende Artikel

Mehr sehen