Web-Frontend
js-Tutorial
Ausführliche Erklärung zur Verwendung des jQuery Plupload-Upload-Plug-Ins
Ausführliche Erklärung zur Verwendung des jQuery Plupload-Upload-Plug-Ins
Dieser Artikel stellt hauptsächlich die Verwendung des jQuery Plupload-Upload-Plug-Ins vor. Freunde, die es benötigen, können darauf verweisen.
Erster Download von plupload->http://www.plupload.com
Da Plupload über viele konfigurierbare Parameter verfügt, werden die am häufigsten verwendeten hier in Kombination mit jquery erläutert. UI-Anzeigeschnittstelle! Wie folgt:
Plupload unterstützt standardmäßig HTML5, Flash, Silverlight, HTML4. Wenn der Browser HTML5 nicht unterstützt, wird Flash ausgewählt .Am Ende, html4,
Wenn Sie eine bestimmte Upload-Methode nicht benötigen, schreiben Sie sie einfach nicht in die Konfiguration!
Laden Sie den Code direkt hoch
<body>
<p id="uploader">
<p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p>
</p>
<script type="text/javascript">
$(function(){
$("#uploader").plupload({
runtimes: 'html5,flash,silverlight,html4',//这里可以不写,plupload默认支持
url: "UploadPhotoServlet",//上传后台请求路径
max_file_size: '1000mb',//用来限制单个文件大小的
multi_selection: true,//默认支持多文件上传,false不支持
chunk_size: '0',//是否将上传文件进行分片,0代表是不分
/*resize配置是对图片的处理
可以使用该参数对将要上传的图片进行压缩，该参数是一个对象，里面包括5个属性：width：指定压缩后图片的宽度，如果没有设置该属性则默认为原始图片的宽度
height：指定压缩后图片的高度，如果没有设置该属性则默认为原始图片的高度
crop：是否裁剪图片
quality：压缩后图片的质量，只对jpg格式的图片有效，默认为90。quality可以跟width和height一起使用，但也可以单独使用，单独使用时，压缩后图片的宽高不会变化，但由于质量降低了，所以体积也会变小
preserve_headers：压缩后是否保留图片的元数据，true为保留，false为不保留,默认为true。删除图片的元数据能使图片的体积减小一点点
resize参数的配置示例如下：
*/
/* resize : {
width: 200,
height: 200,
quality: 90,
crop: true
}, */
/* rename: true, *///允许多队列文件进行重命名
/* sortable: true,*/ //启用队列中的文件排序功能，更改上传优先级
/*dragdrop: true, */ //开启拖拽上传,默认true
/*
下面是展示右边的缩略图和列表 两个功能
默认显示缩略图
*/
views: {
list: true,
thumbs: true, // Show thumbs
active: 'thumbs'
},
/*
flash 和 xap 上传需要的文件
*/
flash_swf_url : 'plupload/js/Moxie.swf',
silverlight_xap_url : 'plupload/js/Moxie.xap'
});
})
</script>
</body>Es gibt einen solchen Satz in der offiziellen Dokumentation
Mit anderen Worten: UI.Plupload Benötigen Sie jquery-ui-Unterstützung, http://jqueryui.com/download/ Wählen Sie das entsprechende Thema, ich habe dieses ausgewählt
Die vollständige Importdatei ist
<head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="plupload/js/jquery.js"></script> <script type="text/javascript" src="plupload/js/jqueryui/jquery-ui.min.js"></script> <link rel="stylesheet" href="plupload/js/jqueryui/jquery-ui.min.css" rel="external nofollow" /> <script type="text/javascript" src="plupload/js/plupload.full.min.js"></script> <script type="text/javascript" src="plupload/js/jquery.ui.plupload/jquery.ui.plupload.min.js"></script> <script type="text/javascript" src="plupload/js/i18n/zh_CN.js"></script> <link rel="stylesheet" type="text/css" href="plupload/js/jquery.ui.plupload/css/jquery.ui.plupload.css" rel="external nofollow" /> <title>plupload</title> </head>
Häufig gestellte Fragen:
1. Wenn Sie feststellen, dass das Popup-Dateifeld sehr langsam ist, wenn Sie auf die Schaltfläche „Datei auswählen“ klicken Entfernen Sie einfach den Filterdateicode! Abhängig von der spezifischen Situation können Sie
filters: {
mime_types : [ //只允许上传图片和zip文件
{ title : "Image files", extensions : "jpg,gif,png" },
{ title : "Zip files", extensions : "zip" }
],
max_file_size : '400kb', //最大只能上传400kb的文件
prevent_duplicates : true //不允许选取重复文件
}selbst festlegen. Mit diesem Parameter können Sie den Typ, die Größe usw. der hochgeladenen Dateien einschränken. Dieser Parameter wird in Form eines Objekts übergeben. Es enthält drei Attribute: mime_types: Der Dateityp ist ein Array. Das Objekt hat zwei Attribute: Titel und Erweiterungen Wenn es mehrere Dateierweiterungen gibt, trennen Sie diese durch Kommas. Diese Eigenschaft ist standardmäßig ein leeres Array, d. h. es gibt keine Begrenzung.
max_file_size: Wird verwendet, um die Größe der hochgeladenen Datei zu begrenzen. Wenn die Dateigröße diesen Wert überschreitet, kann sie nicht ausgewählt werden. Der Wert kann eine Zahl sein, die Einheit ist b, oder es kann eine Zeichenfolge sein, die aus einer Zahl und einer Einheit besteht, z. B. „200 KB“
prevent_duplicates: ob die Auswahl doppelter Dateien wann zugelassen werden soll wahr bedeutet, dass es nicht erlaubt ist. Wenn es falsch ist, bedeutet es erlaubt, und der Standardwert ist falsch. Wenn der Dateiname und die Größe der beiden Dateien gleich sind, werden sie als doppelte Dateien betrachtet
2. Wenn der Dateidomänenname im Hintergrund zum Empfangen der Datei verwendet wird und zusätzliche Parameter angehängt werden
Sie müssen zwei zusätzliche Parameter festlegen
file_data_name:"uploadFile",//指定文件上传时文件域的名称，默认为file,例如在php中你可以使用$_FILES['file']来获取上传的文件信息
/* resize : {
width: 200,
height: 200,
quality: 90,
crop: true // crop to exact dimensions
}, */
multipart_params:{//上传时的附加参数，以键/值对的形式传入，服务器端可是使用$_POST来获取这些参数(以php为例)
"prefixName":"magazine"
},3. Bei der Integration mit easyui, extjs und anderen UI-Bibliotheken wird die Datei eingeführt Plupload muss in easyui sein, bevor die Datei eingeführt wird, sonst treten bei easyui einige unerklärliche Fehler auf!
OK, die Verwendung von Plupload ist hier im Wesentlichen abgeschlossen. Das chinesische Referenzdokument von Plupload ist http://www.phpin.net/tools/plupload/.
Dieses Dokument stellt nur die grundlegenden Optionen von vor Plupload, einige erweiterte UI-Nutzung erfordert Referenz,
http://www.plupload.com/docs/v2/UI.Plupload#Constructor-method
Verwandte Empfehlungen:
Detaillierte Erläuterung des asynchronen Upload-Plug-ins für jquery ajaxfileupload
ThinkPHP5.0-Implementierung des Bild-Upload-Plug-ins mit Beispielfreigabe
Verwendung des jQuery-Upload-Plug-Ins Webupload Detaillierte Erläuterung der Methode
Das obige ist der detaillierte Inhalt vonAusführliche Erklärung zur Verwendung des jQuery Plupload-Upload-Plug-Ins. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Heiße KI -Werkzeuge
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Undress AI Tool
Ausziehbilder kostenlos
Clothoff.io
KI-Kleiderentferner
Video Face Swap
Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!
Heißer Artikel
Heiße Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Heiße Themen
1393
52
Wie verwende ich das DirectX-Reparaturtool? Detaillierte Verwendung des DirectX-Reparaturtools
Mar 15, 2024 am 08:31 AM
Das DirectX-Reparaturtool ist ein professionelles Systemtool. Seine Hauptfunktion besteht darin, den DirectX-Status des aktuellen Systems zu erkennen. Möglicherweise wissen viele Benutzer nicht, wie man das DirectX-Reparaturtool verwendet. Schauen wir uns das ausführliche Tutorial unten an. 1. Verwenden Sie die Reparaturtool-Software, um die Reparaturerkennung durchzuführen. 2. Wenn nach Abschluss der Reparatur angezeigt wird, dass ein ungewöhnliches Problem in der C++-Komponente vorliegt, klicken Sie bitte auf die Schaltfläche „Abbrechen“ und dann auf die Menüleiste „Extras“. 3. Klicken Sie auf die Schaltfläche „Optionen“, wählen Sie die Erweiterung aus und klicken Sie auf die Schaltfläche „Erweiterung starten“. 4. Nachdem die Erweiterung abgeschlossen ist, erkennen und reparieren Sie sie erneut. 5. Wenn das Problem nach Abschluss des Reparaturtoolvorgangs immer noch nicht behoben ist, können Sie versuchen, das Programm, das den Fehler gemeldet hat, zu deinstallieren und erneut zu installieren.
So verwenden Sie Baidu Netdisk – So verwenden Sie Baidu Netdisk
Mar 04, 2024 pm 09:28 PM
Viele Freunde wissen immer noch nicht, wie man Baidu Netdisk verwendet, daher wird der Herausgeber unten erklären, wie man Baidu Netdisk verwendet. Wenn Sie es brauchen, schauen Sie es sich meiner Meinung nach an. Schritt 1: Melden Sie sich direkt nach der Installation von Baidu Netdisk an (wie im Bild gezeigt); Schritt 2: Wählen Sie dann „Meine Freigabe“ und „Übertragungsliste“ gemäß den Seitenaufforderungen (wie im Bild gezeigt); Friend Sharing“ können Sie Bilder und Dateien direkt mit Freunden teilen (wie im Bild gezeigt); Schritt 4: Wählen Sie dann „Teilen“ und wählen Sie dann Computerdateien oder Netzwerkfestplattendateien aus (wie im Bild gezeigt); Fünfter Schritt 1: Dann können Sie Freunde finden (wie im Bild gezeigt); Schritt 6: Die benötigten Funktionen finden Sie auch in der „Funktionsschatzkiste“ (wie im Bild gezeigt). Das Obige ist die Meinung des Herausgebers
So verwenden Sie Potplayer – So verwenden Sie Potplayer
Mar 04, 2024 pm 06:10 PM
Potplayer ist ein sehr leistungsfähiger Mediaplayer, aber viele Freunde wissen immer noch nicht, wie man Potplayer verwendet. Heute werde ich die Verwendung von Potplayer im Detail vorstellen und hoffe, allen zu helfen. 1. PotPlayer-Tastenkombinationen Die standardmäßigen Tastenkombinationen für den PotPlayer-Player sind wie folgt: (1) Wiedergabe/Pause: Leertaste (2) Lautstärke: Mausrad, Pfeiltasten nach oben und unten (3) Vorwärts/Rückwärts: Pfeil nach links und rechts Tasten (4) Lesezeichen: P- Lesezeichen hinzufügen, H-View-Lesezeichen (5) Vollbild/Wiederherstellen: Eingabe (6) Geschwindigkeit: C-Beschleunigung, 7) Vorheriges/nächstes Bild: D/
Mar 18, 2024 am 11:07 AM
Das KMS Activation Tool ist ein Softwaretool zur Aktivierung von Microsoft Windows- und Office-Produkten. KMS ist die Abkürzung für KeyManagementService, einen Schlüsselverwaltungsdienst. Das KMS-Aktivierungstool simuliert die Funktionen des KMS-Servers, sodass der Computer eine Verbindung zum virtuellen KMS-Server herstellen kann, um Windows- und Office-Produkte zu aktivieren. Das KMS-Aktivierungstool ist klein und leistungsstark und kann mit einem Klick dauerhaft aktiviert werden. Es kann jede Version des Windows-Systems und jede Version der Office-Software aktivieren, ohne dass eine Verbindung zum Internet besteht und häufig aktualisiertes Windows-Aktivierungstool. Heute werde ich es Ihnen vorstellen. Lassen Sie mich Ihnen die kms-Aktivierungsarbeit vorstellen
Wie verwende ich die PUT-Anfragemethode in jQuery?
Feb 28, 2024 pm 03:12 PM
Wie verwende ich die PUT-Anfragemethode in jQuery? In jQuery ähnelt die Methode zum Senden einer PUT-Anfrage dem Senden anderer Arten von Anfragen, Sie müssen jedoch auf einige Details und Parametereinstellungen achten. PUT-Anfragen werden normalerweise zum Aktualisieren von Ressourcen verwendet, beispielsweise zum Aktualisieren von Daten in einer Datenbank oder zum Aktualisieren von Dateien auf dem Server. Das Folgende ist ein spezifisches Codebeispiel, das die PUT-Anforderungsmethode in jQuery verwendet. Stellen Sie zunächst sicher, dass Sie die jQuery-Bibliotheksdatei einschließen. Anschließend können Sie eine PUT-Anfrage senden über: $.ajax({u
So verwenden Sie das Xiaomi Win7-Aktivierungstool - So verwenden Sie das Xiaomi Win7-Aktivierungstool
Mar 04, 2024 pm 06:16 PM
Ich glaube, dass viele Benutzer das Xiaomi Win7-Aktivierungstool verwenden, aber wissen Sie, wie man das Xiaomi Win7-Aktivierungstool verwendet? Dann zeigt Ihnen der Editor, wie man das Xiaomi Win7-Aktivierungstool verwendet. Bitte kommen Sie zum folgenden Artikel. Mal sehen. Der erste Schritt besteht darin, nach der Neuinstallation des Systems zu „Arbeitsplatz“ zu gehen, im oberen Menü auf „Systemeigenschaften“ zu klicken und den Windows-Aktivierungsstatus zu überprüfen. Klicken Sie im zweiten Schritt, um das Win7-Aktivierungstool online herunterzuladen, und klicken Sie, um es zu öffnen (es sind überall viele Ressourcen verfügbar). Der dritte Schritt besteht darin, das Xiaomi-Aktivierungstool zu öffnen und auf „Windows dauerhaft aktivieren“ zu klicken. Der vierte Schritt besteht darin, darauf zu warten, dass der Aktivierungsprozess die Aktivierung abschließt. Schritt 5: Überprüfen Sie den Windows-Aktivierungsstatus erneut und stellen Sie fest, dass das System aktiviert wurde.
jQuery-Tipps: Ändern Sie schnell den Text aller a-Tags auf der Seite
Feb 28, 2024 pm 09:06 PM
Titel: jQuery-Tipps: Ändern Sie schnell den Text aller Tags auf der Seite. In der Webentwicklung müssen wir häufig Elemente auf der Seite ändern und bedienen. Wenn Sie jQuery verwenden, müssen Sie manchmal den Textinhalt aller a-Tags auf der Seite gleichzeitig ändern, was Zeit und Energie sparen kann. Im Folgenden wird erläutert, wie Sie mit jQuery den Text aller Tags auf der Seite schnell ändern können, und es werden spezifische Codebeispiele angegeben. Zuerst müssen wir die jQuery-Bibliotheksdatei einführen und sicherstellen, dass der folgende Code in die Seite eingefügt wird: <
So verwenden Sie Magnetlinks - So verwenden Sie Magnetlinks
Mar 04, 2024 pm 04:37 PM
Benutzen Sie auch Magnet-Link-Software? Aber wissen Sie, wie man Magnet-Links verwendet? Die erste Methode ist relativ einfach. Wenn [PC] zum Herunterladen einen Magnet-Link verwendet, öffnen Sie zuerst Thunder. Kopieren Sie dann den Magnet-Link direkt. Der Link wird automatisch in Thunder erkannt und ein Download-Fenster wird angezeigt. Klicken Sie einfach, um den Download zu bestätigen und den Download-Vorgang zu starten. Hinweis: Einige alte Versionen von Xunlei können die von Ihnen kopierten Magnet-Links nicht automatisch erkennen. Um sie verwenden zu können, müssen Sie auf die neueste Version von Xunlei aktualisieren.
