使用ueditor時placeholder設定無效問題應對辦法
阿新 • • 發佈:2019-01-23
基本思路:當用戶要使用編輯器輸入文字時,再對輸入框進行例項化,當編輯器失去焦點時,根據輸入內容是否為空,進行應對判斷是否銷燬ueditor物件
程式碼:
<!DOCTYPE html> <html> <head> <title>ueditor</title> <meta charset="utf-8"> <style> #editor { width: 600px; height:400px; margin:auto; } /*** placeholder文字樣式 ***/ #editor::-ms-input-placeholder { font-size: 1.5em; text-align: center; } #editor::-webkit-input-placeholder{ font-size: 1.5em; text-align: center; } </style> </head> <body> <div> <textarea id="editor" placeholder="好好學習天天上上" ></textarea> </div> <script type="text/javascript" charset="utf-8" src="ueditor.config.js"></script> <script type="text/javascript" charset="utf-8" src="ueditor.all.min.js"> </script> <script type="text/javascript" charset="utf-8" src="lang/zh-cn/zh-cn.js"></script> <script type="text/javascript"> window.onload=function(){ var ueObj = null; //編輯器例項 var ueDom = document.getElememtById('editor'); //新增事件監聽 ueDom.addEventListener("focus", function(){ if(ueObj) return ; //如果編輯器已經例項化,直接返回 ueObj = UE.getEditor('editor', {focus:true}); //取得ueditor例項 ueObj.addListener("blur", function(){ //輸入框失去焦點時,如果內容為空,銷燬ueditor if(ueObj.getContent().length == 0) { UE.getEditor('editor').destroy(); ueObj= null; } }) }) } </script> </body> </html>