WebRoot/static/base/lib/kindeditor-4.1.10/examples/jquery-ui.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<!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="jquery-ui/css/smoothness/jquery-ui-1.9.2.custom.css" />
		<link rel="stylesheet" href="../themes/default/default.css" />
		<script charset="utf-8" src="jquery.js"></script>
		<script charset="utf-8" src="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>
		<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>