html代码里面换图片不显示不出来了,微擎 Ueditor 百度编辑器 替换图片不显示问题...
問題:
最近在使用微擎添加公眾號平臺文章時,上傳圖片可以顯示,但是點擊 html(編輯器的按鈕,可以顯示html代碼) 時出現圖片不顯示問題。
我是用的135編輯器挑選的圖文模板,我替換完模板中的圖片后,圖片的鏈接失效,圖片不顯示。
原因:
查看了源代碼后發現圖片的src鏈接不帶域名,直接顯示images/,但是在微擎下圖片的根目錄是\attachment,圖片缺少根路徑導致了圖片不能顯示。
解決:
既然是路徑問題,那我開始沒有點擊html時圖片能夠正常顯示的,那就說明,圖片一開始路徑是沒有問題的,但是當我點擊了html后出現路徑不對,那問題應該就是在點擊html時觸發了什么事件。
看了ueditor的api發現在觸發html事件是,會執行一個getContent()方法,這個方法會過濾html,會把img標簽下的_src屬性賦值到src,而_src的路徑在微擎里面是獲取的imgs[0]['attachemnt'],這個路徑不會包含http和attachment
所以,我們修改微擎的代碼把'_src' : imgs[0]['attachment'],修改為'_src' : imgs[0]['url'],就可以解決問題了。
代碼:
文件路徑
\web\common\tpl.func.php 大概在 1013行左右
UE.registerUI('myinsertimage',function(editor,uiName){
editor.registerCommand(uiName, {
execCommand:function(){
require(['fileUploader'], function(uploader){
uploader.show(function(imgs){
console.log(imgs)
if (imgs.length == 0) {
return;
} else if (imgs.length == 1) {
editor.execCommand('insertimage', {
'src' : imgs[0]['url'],
'_src' : imgs[0]['url'],
'width' : '100%',
'alt' : imgs[0].filename
});
} else {
var imglist = [];
for (i in imgs) {
imglist.push({
'src' : imgs[i]['url'],
'_src' : imgs[i]['url'],
'width' : '100%',
'alt' : imgs[i].filename
});
}
editor.execCommand('insertimage', imglist);
}
}, opts);
});
}
});
總結
以上是生活随笔為你收集整理的html代码里面换图片不显示不出来了,微擎 Ueditor 百度编辑器 替换图片不显示问题...的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Java编程中程序员会遇到的一些感性烦恼
- 下一篇: zbar扫描无法近距离扫码_生意好时最怕