Wie überprüfe ich die Bildbreite und -höhe vor dem Hochladen mit Javascript?

Überprüfen Sie die Bildbreite und -höhe vor dem Hochladen mit Javascript

Bevor Benutzer ein Bild in eine Webanwendung hochladen können, müssen unbedingt dessen Abmessungen überprüft werden um die Kompatibilität mit den gewünschten Anzeigeanforderungen sicherzustellen. Dieser Javascript-Code bietet eine Lösung zum Überprüfen der Bildbreite und -höhe, bevor die Übermittlung der Datei zugelassen wird:

<code class="javascript">var _URL = window.URL || window.webkitURL;
$(&quot;#file&quot;).change(function (e) {
    var file, img;
    if ((file = this.files[0])) {
        img = new Image();
        var objectUrl = _URL.createObjectURL(file);
        img.onload = function () {
            if (this.width < 240 || this.height < 240) {
                alert("Image too small (min 240x240)");
            } else {
                // Validation passed
                // Proceed with upload
            }
            _URL.revokeObjectURL(objectUrl);
        };
        img.src = objectUrl;
    }
});</code>

Dieser Code erstellt ein Bildobjekt aus der vom Benutzer ausgewählten Datei. Das „onload“-Ereignis des Bildobjekts wird verwendet, um die Breite und Höhe zu ermitteln, die dann mit den gewünschten Mindestabmessungen verglichen werden. Wenn das Bild die Kriterien erfüllt, ist die Validierung erfolgreich und der Upload kann fortgesetzt werden. Andernfalls wird eine Warnung angezeigt, die den Benutzer darüber informiert, dass das Bild zu klein ist.

Hinweis: Es ist wichtig zu bedenken, dass einige Browser, wie z. B. Safari, die Methode URL.createObjectURL() möglicherweise nicht unterstützen. Für eine browserübergreifende Kompatibilität sollten bei Bedarf alternative Methoden geprüft werden.

Das obige ist der detaillierte Inhalt vonWie überprüfe ich die Bildbreite und -höhe vor dem Hochladen mit Javascript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!