百度富文本编辑器Ueditor上传图片时标签中添加宽高
ueditor.all.js中:直接搜索callback()
function callback(){
try{
var link, json, loader,
body = (iframe.contentDocument || iframe.contentWindow.document).body,
result = body.innerText || body.textContent || '';
json = (new Function("return " + result))();
link = me.options.imageUrlPrefix + json.url;
if(json.state == 'SUCCESS' && json.url) {
loader = me.document.getElementById(loadingId);
loader.setAttribute('src', link);
loader.setAttribute('_src', link);
/*==================自己添加的代码====================*/
var width='';
var height='';
// 创建对象
var img = new Image();
// 设置图片的src
img.src = link;
//console.log("link:"+link);
img.onload = function(){
console.log('width:'+img.width+',height:'+img.height);
width=img.width;
height=img.height;
loader.setAttribute('width',width);
loader.setAttribute('height',height);
};
/*===================结束========================*/
loader.setAttribute('title', json.title || '');
loader.setAttribute('alt', json.original || '');
loader.removeAttribute('id');
domUtils.removeClasses(loader, 'loadingclass');
} else {
showErrorLoader && showErrorLoader(json.state);
}
}catch(er){
showErrorLoader && showErrorLoader(me.getLang('simpleupload.loadError'));
}
form.reset();
domUtils.un(iframe, 'load', callback);
}
或者自己设定大小
/*==================自己添加的代码====================*/
var width='';
var height='';
// 创建对象
var img = new Image();
// 设置图片的src
img.src = link;
//console.log("link:"+link);
img.onload = function(){
console.log('width:'+img.width+',height:'+img.height);
width=img.width;
height=img.height;
loader.setAttribute('width','340px');
// loader.setAttribute('height',height);
};
/*===================结束========================*/
或者
loader.setAttribute('width','100%');

前端显示也100%
百度富文本编辑器Ueditor上传图片时标签中添加宽高的更多相关文章
- 百度富文本编辑器UEditor安装配置全过程
网站开发时富文本编辑器是必不可少的,他可以让用户自行编辑内容的样式然后上传到后台!下面我们来介绍如何安装使用百度富文本编辑器 一.下载并且设置百度富文本编辑器的样式 你可以去百度UEditor ...
- 百度富文本编辑器ueditor使用总结
最近做的项目用到了ueditor这个东东,但是他的一些配置文档对初次使用者来说很难以理解,故作此总结 相关详细操作链接地址: http://blog.csdn.net/wusuopubupt/arti ...
- 百度富文本编辑器ueditor使用启示
百度富文本编辑器ueditor使用启示 一.总结 一句话总结:使用工具,多去看官方demo,非常详细. 二.百度富文本编辑器ueditor使用启示 官方完整demo 官方完整demo对应的源代码 &l ...
- springboot+layui 整合百度富文本编辑器ueditor入门使用教程(踩过的坑)
springboot+layui 整合百度富文本编辑器ueditor入门使用教程(踩过的坑) 写在前面: 富文本编辑器,Multi-function Text Editor, 简称 MTE, 是一 ...
- thinkphp5.1中适配百度富文本编辑器ueditor
百度富文本编辑器ueditor虽然很老,但是功能齐全,我近期需要能批量粘贴图片的功能,但是找不到,很无奈.然后现在就分享一下如何把ueditor适配到thinkphp5.1,有知道如何批量上传图片的艾 ...
- 百度富文本编辑器ueditor在jsp中的使用(ssm框架中的应用)
折腾了一下午终于把百度富文本编辑器ueditor搞定了! 项目地址:https://github.com/724888/lightnote_new 首先我参考了一个ueditor的demo ...
- Html引入百度富文本编辑器ueditor
在日常工作用,肯定有用到富文本编辑器的时候,富文本编辑器功能强大使用方便,我用的是百度富文本编辑器,首先需要下载好百度编辑器的demo, 然后创建ueditor.html文件,引入百度编辑器,然后在h ...
- Html引入百度富文本编辑器ueditor及自定义工具栏
在日常工作用,肯定有用到富文本编辑器的时候,富文本编辑器功能强大使用方便,我用的是百度富文本编辑器,首先需要下载好百度编辑器的demo, 然后创建ueditor.html文件,引入百度编辑器,然后在h ...
- Jfinal整合百度富文本编辑器ueditor
ueditor配置文件ueditor.config.js修改参数serverUrl:(改为要调用的action) 后台代码 package com.sandu.mega.admin.ueditor; ...
随机推荐
- Ncut matlab 代码bug 修复
先说平台: win7 x64,matlab 2012a x64,亲测运行. ncut 是个图像切割方法,以后再回顾具体算法吧,网上很多流程的是Jianbo Shi 这位2000年写的,名字应该是:Da ...
- Chrome扩展修改页面代码执行环境的方法
Chrome的扩展程序可以通过content scripts向页面中注入js代码,所注入的js代码能够对页面中所有的DOM对象进行操作.由于Chrome在js执行环境上对页面代码和content sc ...
- IDEA 2017.3 新版本中创建 JSF Web 应用程序缺少 web.xml 的解决办法
IDEA 2017.3 新版本中默认创建一个 Web 应用程序很可能不会自动创建 web.xml 文件.虽然说从 JavaEE 6.0 开始 Servlet 3.0 规范中就新增了一些注解可以免去传统 ...
- 启动tomcat服务器自动执行一个方法
第一步:配置web.xml文件 添加如下代码 <servlet> <servlet-name>Timer</servlet-name> <servlet-cl ...
- 关于main函数的参数
#include <stdio.h> int main(int argc, char const *argv[]) { int i; for ( i = 0; i < argc; i ...
- springBoot AOP环绕增强、自定义注解、log4j2、MDC
(一)log4j2 maven配置 <dependency> <groupId>org.springframework.boot</groupId> <art ...
- 提高Android Studio运行、编译速度方案
1.安装完成后启动卡死 刚刚打开studio就卡在gradle building的界面再也不动了(去连接墙外的网下载),那么这个时候我们就需要把这个联网下载操作屏蔽掉,找到studio安装目录,找到i ...
- Android开发 大坑Fragment
是不是弄了半天你的Fragment老是Replace不了,我的原因是:弄成静 态的,然后要动态Replace,竟然不行,后来框个FragmentLayout,改成全动态添加和Replace,OK了.
- MySQL复制表结构和内容到另一张表(转)
MySQL不要看它小,一个开源的产物,要学习它的东西真的很多.而它的一切是SQL Server无法比拟的. 复制表结构及数据到新表 create table 新表 select * from 旧表 只 ...
- mysql之group by,order by
写在前面 上篇文章介绍mysql的增删改查操作,这篇将介绍group和order by操作. 系列文章 mysql之创建数据库,创建数据表 mysql之select,insert,delete,upd ...
