KindEditor在jQuery UI Dialog下面的问题，添加自定义插件

最新推荐文章于 2024-06-21 11:56:25 发布

不净之心

最新推荐文章于 2024-06-21 11:56:25 发布

阅读量193

点赞数

分类专栏：开源应用 jQuery插件收集文章标签： ui javascript ViewUI

本文链接：https://blog.csdn.net/pyzheng/article/details/84492353

版权

开源应用同时被 2 个专栏收录

156 篇文章 0 订阅

订阅专栏

jQuery插件收集

55 篇文章 0 订阅

订阅专栏

[url]http://www.kindsoft.net/ke4/examples/jquery-ui.html[/url]
添加自定义插件 [url]http://kindeditor.net/docs/plugin.html[/url]

在页面的时候使用

KindEditor.ready(function(K) {
        editor =KindEditor.create('textarea[name="content"]', {
            allowFileManager : true,
            resizeType : 1
        });
    });

在dialog的时候直接create:

editor =KindEditor.create('textarea[name="content"]', {
        allowFileManager : true,
        resizeType : 1
    });

参考代码：

<!doctype html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>With jQuery UI</title>
		<style>
			body {
				font-size: 12px;
			}
			form {
				margin: 0;
			}
			textarea {
				display: block;
			}
			#J_editorDialog {
				display: none;
			}
		</style>
		<link rel="stylesheet" href="../lib/jquery-ui/css/smoothness/jquery-ui-1.9.2.custom.css" />
		<link rel="stylesheet" href="../themes/default/default.css" />
		<script charset="utf-8" src="../lib/jquery.js"></script>
		<script charset="utf-8" src="../lib/jquery-ui/js/jquery-ui-1.9.2.custom.js"></script>
		<script charset="utf-8" src="../kindeditor.js"></script>
		<script charset="utf-8" src="../lang/zh_CN.js"></script>
		<script>
			$(function() {
				$('#J_openDialog').click(function() {
					$('#J_editorDialog').dialog({
						title : 'KindEditor',
						width : 700,
						open : function(event, ui) {
							// 打开Dialog后创建编辑器
							KindEditor.create('textarea[name="content"]', {
								resizeType : 1
							});
						},
						beforeClose : function(event, ui) {
							// 关闭Dialog前移除编辑器
							KindEditor.remove('textarea[name="content"]');
						}
					});
				});
			});
		</script>
	</head>
	<body>
		<script type="text/javascript"><!--
		google_ad_client = "ca-pub-7116729301372758";
		/* 更多演示（728x90） */
		google_ad_slot = "5052271949";
		google_ad_width = 728;
		google_ad_height = 90;
		//-->
		</script>
		<script type="text/javascript"
		src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
		</script>
		<h3>在jQuery UI Dialog里打开编辑器</h3>
		<div id="J_editorDialog">
			<textarea name="content" style="width:100%;height:200px;"></textarea>
		</div>
		<button type="button" id="J_openDialog">打开Dialog</button>
	</body>
</html>