jQuery-Plug-in ajaxFileUpload
ajaxFileUpload ist ein jQuery-Plug-in zum asynchronen Hochladen von Dateien
Laden Sie eine unbekannte Version hoch, damit Sie in Zukunft nicht überall danach suchen müssen.
Syntax: $.ajaxFileUpload([options])
Optionsparameterbeschreibung:
1.
2. fileElementId Die ID des Dateifelds, das hochgeladen werden muss, also die ID von .
3. secureuri Ob die sichere Übermittlung aktiviert werden soll, der Standardwert ist false.
4, dataType Der vom Server zurückgegebene Datentyp. Kann XML, Skript, JSON, HTML sein. Wenn Sie es nicht ausfüllen, wird es von jQuery automatisch ermittelt.
5, Erfolg ist eine Verarbeitungsfunktion, die nach erfolgreicher Übermittlung automatisch ausgeführt wird. Die Parameterdaten sind die vom Server zurückgegebenen Daten.
6, Fehler Behandlungsfunktion, die automatisch ausgeführt wird, wenn die Übermittlung fehlschlägt.
7, Daten Benutzerdefinierte Parameter. Dieses Ding ist nützlicher, wenn Daten zum hochgeladenen Bild vorhanden sind.
8, geben Sie ein.
Fehlermeldung:
1, SyntaxErr oder: fehlt ; vor Anweisungsfehler
Wenn dieser Fehler auftritt, müssen Sie überprüfen, ob der URL-Pfad vorhanden ist ist zugänglich
2, SyntaxError: Syntaxfehler
Wenn dieser Fehler auftritt, müssen Sie prüfen, ob ein Syntaxfehler im Hintergrundhandler des Servers vorliegt, der den Übermittlungsvorgang verarbeitet
3, SyntaxError: Fehler aufgrund einer ungültigen Eigenschafts-ID
Wenn dieser Fehler auftritt, müssen Sie prüfen, ob die Textfeldattribut-ID vorhanden ist
4, SyntaxError: fehlt } im XML-Ausdrucksfehler
Wenn dieser Fehler auftritt, müssen Sie prüfen, ob der Dateiname konsistent ist oder nicht vorhanden
5. Andere benutzerdefinierte Fehler
Sie können die Variable $error direkt verwenden, um zu überprüfen, ob jeder Parameter korrekt ist. Dies ist viel praktischer als die oben genannten ungültigen Fehleraufforderungen.
So verwenden Sie:
Schritt 1: Stellen Sie zunächst die Plug-Ins jQuery und ajaxFileUpload vor. Achten Sie selbstverständlich auf die Reihenfolge.
<script src="jquery-1.7.1.js" type="text/javascript"></script> <script src="ajaxfileupload.js" type="text/javascript"></script>
Schritt 2: HTML-Code:
<body> <p><input type="file" id="file1" name="file" /></p> <input type="button" value="上传" /> <p><img id="img1" alt="上传成功啦" src="" /></p> </body>
Schritt 3: JS-Code
<script src="jquery-1.7.1.js" type="text/javascript"></script> <script src="ajaxfileupload.js" type="text/javascript"></script>
Schritt 4: Backend-Seite upload.aspx-Code:
protected void Page_Load(object sender, EventArgs e) { HttpFileCollection files = Request.Files; string msg = string.Empty; string error = string.Empty; string imgurl; if (files.Count > 0) { files[0].SaveAs(Server.MapPath("/") + System.IO.Path.GetFileName(files[0].FileName)); msg = " 成功! 文件大小为:" + files[0].ContentLength; imgurl = "/" + files[0].FileName; string res = "{ error:'" + error + "', msg:'" + msg + "',imgurl:'" + imgurl + "'}"; Response.Write(res); Response.End(); } }
Nehmen wir ein Beispiel der MVC-Version:
Controller-Code
public class HomeController : Controller { public ActionResult Index() { return View(); } public ActionResult Upload() { HttpFileCollection hfc = System.Web.HttpContext.Current.Request.Files; string imgPath = ""; if (hfc.Count > 0) { imgPath = "/testUpload" + hfc[0].FileName; string PhysicalPath = Server.MapPath(imgPath); hfc[0].SaveAs(PhysicalPath); } return Content(imgPath); } }
Front-End-Ansicht, HTML- und JS-Code geben nach erfolgreichem Upload den Originalcode zurück Bildadresse und binden Sie es an die SRC-Adresse von
<body> <p><input type="file" id="file1" name="file" /></p> <input type="button" value="上传" /> <p><img id="img1" alt="上传成功啦" src="" /></p> </body>
. Zum Schluss hier ein Beispiel für das Hochladen eines Bildes mit Parametern: Controller-Code:
public class HomeController : Controller { public ActionResult Index() { return View(); } public ActionResult Upload() { NameValueCollection nvc = System.Web.HttpContext.Current.Request.Form; HttpFileCollection hfc = System.Web.HttpContext.Current.Request.Files; string imgPath = ""; if (hfc.Count > 0) { imgPath = "/testUpload" + hfc[0].FileName; string PhysicalPath = Server.MapPath(imgPath); hfc[0].SaveAs(PhysicalPath); } //注意要写好后面的第二第三个参数 return Json(new { Id = nvc.Get("Id"), name = nvc.Get("name"), imgPath1 = imgPath },"text/html", JsonRequestBehavior.AllowGet); } }
Indexansicht Code:
<body> <p><input type="file" id="file1" name="file" /></p> <input type="button" value="上传" /> <p><img id="img1" alt="上传成功啦" src="" /></p> </body>
In diesem Beispiel wird das asynchron hochgeladene Bild angezeigt und gleichzeitig werden die benutzerdefinierten Übertragungsparameter angezeigt.

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



Häufig gestellte Fragen und Lösungen für das Ticket-Ticket-Ticket-Ticket in Front-End im Front-End-Entwicklungsdruck ist der Ticketdruck eine häufige Voraussetzung. Viele Entwickler implementieren jedoch ...

Es gibt kein absolutes Gehalt für Python- und JavaScript -Entwickler, je nach Fähigkeiten und Branchenbedürfnissen. 1. Python kann mehr in Datenwissenschaft und maschinellem Lernen bezahlt werden. 2. JavaScript hat eine große Nachfrage in der Entwicklung von Front-End- und Full-Stack-Entwicklung, und sein Gehalt ist auch beträchtlich. 3. Einflussfaktoren umfassen Erfahrung, geografische Standort, Unternehmensgröße und spezifische Fähigkeiten.

JavaScript ist der Eckpfeiler der modernen Webentwicklung. Zu den Hauptfunktionen gehören eine ereignisorientierte Programmierung, die Erzeugung der dynamischen Inhalte und die asynchrone Programmierung. 1) Ereignisgesteuerte Programmierung ermöglicht es Webseiten, sich dynamisch entsprechend den Benutzeroperationen zu ändern. 2) Die dynamische Inhaltsgenerierung ermöglicht die Anpassung der Seiteninhalte gemäß den Bedingungen. 3) Asynchrone Programmierung stellt sicher, dass die Benutzeroberfläche nicht blockiert ist. JavaScript wird häufig in der Webinteraktion, der einseitigen Anwendung und der serverseitigen Entwicklung verwendet, wodurch die Flexibilität der Benutzererfahrung und die plattformübergreifende Entwicklung erheblich verbessert wird.

Wie fusioniere ich Array -Elemente mit derselben ID in ein Objekt in JavaScript? Bei der Verarbeitung von Daten begegnen wir häufig die Notwendigkeit, dieselbe ID zu haben ...

Diskussion über die Realisierung von Parallaxe -Scrolling- und Elementanimationseffekten in diesem Artikel wird untersuchen, wie die offizielle Website der Shiseeido -Website (https://www.shiseeido.co.jp/sb/wonderland/) ähnlich ist ...

JavaScript zu lernen ist nicht schwierig, aber es ist schwierig. 1) Verstehen Sie grundlegende Konzepte wie Variablen, Datentypen, Funktionen usw. 2) Beherrschen Sie die asynchrone Programmierung und implementieren Sie sie durch Ereignisschleifen. 3) Verwenden Sie DOM -Operationen und versprechen Sie, asynchrone Anfragen zu bearbeiten. 4) Vermeiden Sie häufige Fehler und verwenden Sie Debugging -Techniken. 5) Die Leistung optimieren und Best Practices befolgen.

Eingehende Diskussion der Ursachen des Unterschieds in der Konsole.log-Ausgabe. In diesem Artikel wird die Unterschiede in den Ausgabeergebnissen der Konsolenfunktion in einem Code analysiert und die Gründe dafür erläutert. � ...

Erforschen Sie die Implementierung der Funktion des Bedien- und Drop-Einstellungsfunktion der Panel ähnlich wie VSCODE im Front-End. In der Front-End-Entwicklung wird VSCODE ähnlich wie VSCODE implementiert ...
