<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta charset="UTF-8"> <title>自定義圖片文件上傳</title> <link href="zx-editor.css" rel="stylesheet"> </head> <body> <div id="editorContainer"></div> <script src="https://cdnjs.cloudflare.com/ajax/libs/js-polyfills/0.1.42/polyfill.min.js"></script> <!--exif獲取照片參數插件--> <script src="exif.min.js"></script> <!--debug--> <script src="https://cdn.bootcss.com/vConsole/3.2.0/vconsole.min.js"></script> <script src="zx-editor.js"></script> <script src='../../public/js/jquery.min.js'></script> <style> .zx-editor .zx-editor-toolbar-wrapper.border-top.in { top:0; } </style> <script> // 實例化 ZxEditor var zxEditor = new ZxEditor('#editorContainer', { editable: true, bottom:0, toolbarBeenFixed:true, isSeesionStorage:'seesionStorage', toolbarHeight:100, autoSave:1000, cursorColor: 'red', customPictureHandler:false, //自定義圖片處理，即不使用默認插入圖片邏輯。 imageMaxWidth:300, //正文中插入圖片的最大寬度 mainColor:'#f00', // imageSectionTemp:'true' }) // zxEditor.storage.set('content', {content: '內容',title: '標題'}) // 實例化 VConsole // new VConsole() // console.log(debug) console.log('實例化 ZxEditor', zxEditor); zxEditor.on('change', function () { console.log('change input') }) zxEditor.on('paste', function (e) { console.log('paste', e) }) zxEditor.on('keydown', function () { // console.log('keydown') }) zxEditor.on('keyup', function () { // console.log('keyup') }) zxEditor.on('selectPictureInputChange', function (file, ze, e) { console.log(file) }) zxEditor.on('error', function (e, methodName) { console.log(methodName) console.error(e) }) zxEditor.on('windowResize', function () { console.error('windowResize', window.innerHeight) }) zxEditor.on('add-link', next => { // hybrid模式開發時，此處可以調用原生App提供的接口，訪問剪貼板是否有url地址數據 // 獲取到url地址、及其文檔title // 將鏈接添加至編輯器中 next(url, title) }) const customPanel = new zxEditor.ExpansionPanel({ body: '這是一個文本' }, zxEditor) zxEditor.dialog.alert('這是alert提示框', function () { // do something ... }) </script> </body> </html>