ueditor是经过总公司二次开发过的。
增加了一个设置纸张大小的工具
/**
* 设置纸张大小
* 二次开发
*/
UE.plugins['papersize'] = function () {
var me = this;
me.setOpt({ 'papersize': ['默认', 'A4', 'B5'] });
me.commands['papersize'] = {
execCommand: function (cmdName, value) {
switch (value) {
case "A4":
//me.body.style.margin = "40px 93px 40px 93px";
//me.body.setAttribute("ue_paper", "trs_paper_A4");
$(me.body).removeClass("trs_paper_B5").removeClass("trs_paper_default");
$(me.body).addClass("trs_paper_A4");
break;
case "B5":
//me.body.style.margin = "40px 113px 40px 113px";
//me.body.setAttribute("ue_paper", "trs_paper_B5");
$(me.body).removeClass("trs_paper_A4").removeClass("trs_paper_default");
$(me.body).addClass("trs_paper_B5");
break;
default:
//me.body.style.margin = "40px 23px 40px 23px";
//me.body.setAttribute("ue_paper", "trs_paper_default");
$(me.body).removeClass("trs_paper_A4").removeClass("trs_paper_B5");
$(me.body).addClass("trs_paper_default");
}
return true;
},
queryCommandValue: function (cmdName) {//查询当前纸张大小
var nowSize;
UE.utils.each(me.body.classList.toString().split(" "), function (cls) {
if (cls.indexOf("trs_paper_") > -1) {
nowSize = cls.split("_")[2];
}
});
return nowSize == "default" ? "默认" : nowSize;
}
};
};
并且在渲染的时候将body的宽度写死了
/**
* 渲染编辑器的DOM到指定容器
* @method render
* @param { Element } containerDom 直接指定容器对象
* @remind 执行该方法,会触发ready事件
* @warning 必须且只能调用一次
*/
render: function (container) {
var me = this,
options = me.options,
getStyleValue = function (attr) {
return parseInt(domUtils.getComputedStyle(container, attr));
};
if (utils.isString(container)) {
container = document.getElementById(container);
}
if (container) {
if (options.initialFrameWidth) {
options.minFrameWidth = options.initialFrameWidth
} else {
options.minFrameWidth = options.initialFrameWidth = container.offsetWidth;
}
if (options.initialFrameHeight) {
options.minFrameHeight = options.initialFrameHeight
} else {
options.initialFrameHeight = options.minFrameHeight = container.offsetHeight;
}
container.style.width = /%$/.test(options.initialFrameWidth) ? '100%' : options.initialFrameWidth -
getStyleValue("padding-left") - getStyleValue("padding-right") + 'px';
container.style.height = /%$/.test(options.initialFrameHeight) ? '100%' : options.initialFrameHeight -
getStyleValue("padding-top") - getStyleValue("padding-bottom") + 'px';
container.style.zIndex = options.zIndex;
var html = (ie && browser.version < 9 ? '' : '<!DOCTYPE html>') +
'<html xmlns=\'http://www.w3.org/1999/xhtml\'><head>' +
/*
'<style type=\'text/css\'>' +
//设置四周的留边
'.view{padding:0;word-wrap:break-word;cursor:text;height:90%;overflow:hidden;padding:30px 85px 30px 85px}\n' +
//设置默认字体和字号
//font-family不能呢随便改,在safari下fillchar会有解析问题
'body{margin:8px;font-family:sans-serif;font-size:16px;}' +
//设置段落间距
'p{margin:5px 0;}</style>' +
*/
//默认引入iframe.css样式
(options.iframeDefaultCssUrl ? '<link rel=\'stylesheet\' type=\'text/css\' href=\'' + utils.unhtml(options.iframeDefaultCssUrl) + '\'/>' : '') +
(options.iframeCssUrl ? '<link rel=\'stylesheet\' type=\'text/css\' href=\'' + utils.unhtml(options.iframeCssUrl) + '\'/>' : '') +
(options.initialStyle ? '<style>' + options.initialStyle + '</style>' : '') +
'</head><body class=\'view TRS_UEDITOR trs_paper_default\' >' +
//'</head><body class=\'view \' >' +
'</body>' +
'<script type=\'text/javascript\' ' + (ie ? 'defer=\'defer\'' : '') + ' id=\'_initialScript\'>' +
'setTimeout(function(){editor = window.parent.UE.instants[\'ueditorInstant' + me.uid + '\'];editor._setup(document);},0);' +
'var _tmpScript = document.getElementById(\'_initialScript\');_tmpScript.parentNode.removeChild(_tmpScript);</script></html>';
container.appendChild(domUtils.createElement(document, 'iframe', {
id: 'ueditor_' + me.uid,
width: "100%",
height: "100%",
frameborder: "0",
//先注释掉了,加的原因忘记了,但开启会直接导致全屏模式下内容多时不会出现滚动条
// scrolling :'no',
src: 'javascript:void(function(){document.open();' + (options.customDomain && document.domain != location.hostname ? 'document.domain="' + document.domain + '";' : '') +
'document.write("' + html + '");document.close();}())'
}));
container.style.overflow = 'hidden';
//解决如果是给定的百分比,会导致高度算不对的问题
setTimeout(function () {
if (/%$/.test(options.initialFrameWidth)) {
options.minFrameWidth = options.initialFrameWidth = container.offsetWidth;
//如果这里给定宽度,会导致ie在拖动窗口大小时,编辑区域不随着变化
// container.style.width = options.initialFrameWidth + 'px';
}
if (/%$/.test(options.initialFrameHeight)) {
options.minFrameHeight = options.initialFrameHeight = container.offsetHeight;
container.style.height = options.initialFrameHeight + 'px';
}
})
}
},
纸张样式
/*
* 纸张设置样式 —— Start
*/
.trs_paper_default{
width:777px;
margin:40px auto;
}
.trs_paper_default2{
width:700px;
margin:40px auto;
}
.trs_paper_A4{
width:637px;
margin:40px auto;
}
.trs_paper_B5{
width:597px;
margin:40px auto;
}
/*End*/
然后,在另一个模块中编辑器的宽度不够,输入的时候body会滑动,因此需要在加载的时候修改iframe的默认样式。
在自定义指令的link方法中尝试修改body的宽度失败,应该在加载指令的时候,ue.ready(function () {})中修改
//动态加载指令
function loadDirective() {
LazyLoad.js(["./lib/ueditor_demo/ueditor2/ueditor.config.js?v=7.0", "./lib/ueditor_demo/ueditor2/ueditor.all.js?v=7.0", "./lib/ueditor_demo/js/bottom-menu.js"], function () {
var ueditor = '<ueditor-for-order form="orderForm" versionid = "data.lastVersionid" list="formData"></ueditor-for-order>';
ueditor = $compile(ueditor)($scope);
$($(angular.element(document)).find('ueditorLocation')).append(ueditor);
var ue = UE.getEditor('ueditor');
// $scope.status.support.content = $scope.list.DOCCONTENT;
ue.ready(function () {
//设置iframe的body样式 $(ue.body).removeClass("trs_paper_default").addClass("trs_paper_default2");
ue.addListener("keydown", function (type, event) {
if (event.keyCode === 13) {
//获取纯文本
// $scope.status.support.content = ue.getContentTxt();
}
});
});
});
}