1.ueditor.config.js配置文件中配置

2.在ueditor.all.js配置文件中配置点开的的弹框位置

3.在ueditor1_4_3-utf8-jsp\themes\default\css\ueditor.css的配置文件中,配置点开窗口弹框的大小和自定义图标的图案

4.在ueditor1_4_3-utf8-jsp\dialogs文件夹下定义自己的html弹框的样式

4.1以我的为例,ueditor1_4_3-utf8-jsp\dialogs\mymenu下新建mymenu.html文件

4.2 新建ueditor1_4_3-utf8-jsp\dialogs\mydownfile\mydownfile.html文件

1.ueditor.config.js配置文件中配置

toolbars: [[
            'fullscreen', 'source', '|', 'undo', 'redo', '|',
            'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
            'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
            'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
            'directionalityltr', 'directionalityrtl', 'indent', '|',
            'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
            'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
            'uploadphoto','emotion', 'map', 'insertframe', 'insertcode', 'webapp', 'pagebreak', 'template', 'background', '|',
            'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
            'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',
            'print', 'preview', 'searchreplace', 'help', 'drafts','mydownfile','mymenu'
        ]],labelMap:{
            'anchor':'', 'undo':'','mydownfile':'添加下载专区链接','mymenu':'添加菜单链接'
        }

2.在ueditor.all.js配置文件中配置点开的的弹框位置

iframeUrlMap位置、dialogBtns位置

 var iframeUrlMap = {
        'charts': '~/dialogs/charts/charts.html',
        'mydownfile':'~/dialogs/mydownfile/mydownfile.html',
        'mymenu':'~/dialogs/mymenu/mymenu.html',
    };
    var dialogBtns = {
        noOk:['searchreplace', 'help', 'spechars', 'webapp','preview'],
        ok:['attachment', 'anchor', 'link', 'insertimage', 'map', 'gmap', 'insertframe', 'wordimage',
            'insertvideo', 'insertframe', 'edittip', 'edittable', 'edittd', 'scrawl', 'template', 'music', 'background', 'charts','mydownfile','mymenu']
    };

3.在ueditor1_4_3-utf8-jsp\themes\default\css\ueditor.css的配置文件中,配置点开窗口弹框的大小和自定义图标的图案

.edui-default .edui-toolbar  .edui-for-mydownfile .edui-icon {
    background:url(../images/myimages/icon_downfile2.png) no-repeat left 2px;
}
.edui-default .edui-toolbar .edui-for-mymenu .edui-icon {
    background:url(../images/myimages/icon_menu1.png) no-repeat left 2px;
}
.edui-default .edui-for-mydownfile .edui-dialog-content {
    width: 1000px;
    height: 450px;
}
.edui-default .edui-for-mymenu .edui-dialog-content {
    width: 500px;
    height: 420px;
}

4.在ueditor1_4_3-utf8-jsp\dialogs文件夹下定义自己的html弹框的样式

4.1以我的为例,ueditor1_4_3-utf8-jsp\dialogs\mymenu下新建mymenu.html文件

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<title></title>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
		<script src="/public/ms/javascripts/jquery-1.9.1.min.js" type="text/javascript" charset="${_response_encoding}"></script>
		<script type="text/javascript" src="../internal.js"></script>
		<link rel="stylesheet" media="screen" href="/public/ms/stylesheets/zTreeStyle.min.css">
		<script src="/public/ms/javascripts/jquery.ztree.core-3.5.min.js" type="text/javascript" charset="${_response_encoding}"></script>
		<link rel="stylesheet" media="screen" href="/public/ms/stylesheets/jquery-jbox/2.3/Skins/Blue/jbox.css">
		<script src="/public/ms/javascripts/jquery.ztree.excheck-3.5.min.js" type="text/javascript" charset="${_response_encoding}"></script>
		<script src="/public/ms/javascripts/jquery.jBox-2.3.min.js" type="text/javascript" charset="${_response_encoding}"></script>
		<script src="/public/ms/javascripts/jquery.jBox-zh-CN.min.js" type="text/javascript" charset="${_response_encoding}"></script>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
				color: #838383;
			}
			table {
				font-size: 12px;
				line-height: 30px
			}
			.txt {
				width: 300px;
				height: 21px;
				line-height: 21px;
				border: 1px solid #d7d7d7;
			}
			.mytable {
				position: fixed;
				/*固定作用*/
				_position: absolute;
				/* 把导航栏位置定义为绝对位置  关键*/
				_top: expression(documentElement.scrollTop + "px");
				/* 把导航栏位置放在浏览器垂直滚动条的顶端  关键 */
				z-index: 9999;
				/* 让导航栏浮在网页的高层位置,遇到flash和图片时候也能始终保持最外层 */
			}
		</style>
	</head>

	<body style="padding:0 0 10px 10px;">
		<div class="mytable" style="height:100px;padding:10px 10px 0 10px;left:10px;background:#fff;top:0;">
			<table>
				<tr>
					<td><label for="text"> <var id="lang_input_text"></var></label>
					</td>
					<td>
						<input class="txt" id="text" type="text" />
					</td>
				</tr>
				<tr>
					<td><label for="title" style="wdith:60px;"> <var id="lang_input_title"></var></label></td>
					<td>
						<input class="txt" id="title" type="text" /></td>
				</tr>
				<tr>
					<td colspan="2">
						<label for="target"><var id="lang_input_target"></var></label>
						<input id="target" type=

相关文章:

  • 2022-12-23
  • 2021-09-14
  • 2021-12-15
  • 2022-12-23
  • 2022-12-23
  • 2021-08-26
  • 2022-12-23
  • 2021-05-27
猜你喜欢
  • 2022-12-23
  • 2022-02-26
  • 2022-12-23
  • 2022-12-23
  • 2021-12-04
  • 2022-12-23
  • 2021-08-19
相关资源
相似解决方案