กรณี Summernote ที่ค่อนข้างสมบูรณ์สำหรับการอัปโหลดรูปภาพไม่มีพื้นหลัง (มีหลายกรณีที่อัปโหลดรูปภาพออนไลน์) เฉพาะ JS front-end เท่านั้น รหัสที่ให้ไว้ออนไลน์ แต่มีข้อบกพร่องได้รับการแก้ไข
ในตัวอย่างนี้ JS รับประกันว่าไม่มีข้อผิดพลาด มีการทดสอบส่วนบุคคล
<%@ page language = "java" contentType = "ข้อความ/html; charset = utf-8" pageencoding = "utf-8"%> <! doctype html> <html> <head> href = "// netdna.bootstrappcdn.com/bootstrap/3.0.1/css/bootstrap.min.css" rel = "stylesheet" type = "text/css"> <สคริปต์ src = "// netdna.bootstrappcdn.com/bootstrap/3.0.1/js/bootstrap.min.js"></script> type = "text/css"> <!-ต้อง-> <link href = "summernote-master/dist/summernote.css" rel = "stylesheet" type = "text/css"> <!-ต้อง-> <script src = "summernote-master/dist/summernote src = "summernote-master/lang/summernote-zh-cn.js"> </script> <title> bootstrap-markdown </title> <style> .note-Alarm {float: ขวา; type = "text /javascript"> $ (เอกสาร) .ready (function () { /* ฟังก์ชั่น sendfile (ไฟล์, ตัวแก้ไข, weleditable) {console.log ("file ="+ไฟล์); console.log ("editor ="+editor); console.log $ .ajax ({url: 'blog_images.jsp', ข้อมูล: ข้อมูล, แคช: เท็จ, contentType: false, processData: เท็จ, ประเภท: 'โพสต์', ความสำเร็จ: ฟังก์ชั่น (ข้อมูล) {editor.insertimage 'zh-cn', // default: 'en-us' โฟกัส: จริง, แถบเครื่องมือ: [['สไตล์', ['bold', 'italic', 'ขีดเส้นใต้', 'ชัดเจน'], ['fontsize', ['fontsize'], ['สี', ['' ' ['แทรก', ['รูปภาพ', 'วิดีโอ']]], /*รูปภาพ: {SelectFromFiles: 'เลือกไฟล์'},* / /*onimageUpload: ฟังก์ชั่น (ไฟล์, ตัวแก้ไข, cleeditable) {sendfile (ไฟล์ [0], Editor $ editable);}});}); ฟังก์ชั่น sendfile (ไฟล์, ตัวแก้ไข, $ editable) {$ (". note-toolbar.btn-toolbar"). ผนวก ('อัปโหลดรูปภาพ'); var filename = false; false;} if (! ชื่อไฟล์) {$ (". note-alarm"). ลบ ();} // ข้างต้นป้องกันข้อผิดพลาดพรอมต์ที่เกิดจากการลากและลดลงในตัวแก้ไขในรูปภาพเพื่อให้อัพโหลด var ext = filename.substr (filename. Timestamp+"_"+$ ("#summernote"). attr ('AID')+ext; // ชื่อคือชื่อไฟล์ที่กำหนดไว้ที่ตัวเอง AID เป็นแอตทริบิวต์ที่ฉันเพิ่มเพื่อแยกแยะผู้ใช้ไฟล์ data = new FormData (); data.append ("ไฟล์", ไฟล์); data.append ("key", ชื่อ); data.append ("โทเค็น", $ ("#summernote"). attr ('โทเค็น'); $. ajax อัพโหลด ขั้นตอน กำลังโหลด "); settimeout (function () {$ (". note-alarm "). ลบ ();}, 3000);}, ข้อผิดพลาด: function () {$ (". note-alarm "). html (" อัปโหลด ล้มเหลว "); settimeout (function () {$ (". note-alarm "). ลบ ();}, 3000);}});} </script> </body> </html>บทความข้างต้นเป็นกรณีอัปโหลดรูปภาพ SummerNote ที่ไม่ได้รายงานข้อผิดพลาด นี่คือเนื้อหาทั้งหมดที่ฉันแบ่งปันกับคุณ ฉันหวังว่าคุณจะให้ข้อมูลอ้างอิงและฉันหวังว่าคุณจะสนับสนุน wulin.com มากขึ้น