imengyu
/
minnan-collect-web


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
							<!doctype html>
<html>
<head>
	<meta charset="utf-8" />
	<title>NKeditor 在线编辑器 PHP demo</title>
	<link href="libs/bootstrap/bootstrap.min.css" rel="stylesheet">
	<style>
		.tab-pane form {
			margin-top: 20px;
		}
	</style>
</head>
<body>

	<div class="container" style="padding-top: 20px;">

		<!-- Nav tabs -->
		<ul class="nav nav-tabs" role="tablist">
			<li role="presentation" class="active"><a href="#light" aria-controls="home" role="tab" data-toggle="tab">精简版</a></li>
			<li role="presentation"><a href="#default" aria-controls="profile" role="tab" data-toggle="tab">全功能版</a></li>
			<li role="presentation"><a href="#block" aria-controls="messages" role="tab" data-toggle="tab">雅黑主题</a></li>
			<li role="presentation"><a href="#grey" aria-controls="messages" role="tab" data-toggle="tab">深灰主题</a></li>
			<li role="presentation"><a href="#blue" aria-controls="settings" role="tab" data-toggle="tab">淡蓝主题</a></li>
			<li role="presentation"><a href="#classic" aria-controls="settings" role="tab" data-toggle="tab">经典主题</a></li>
		</ul>

		<div class="tab-content">
			<div role="tabpanel" class="tab-pane fade in active" id="light">
				<form name="example" method="post">
					<textarea name="content1" style="width:900px;height:500px;visibility:hidden;">
						<p>
							<ol>
								<li>
									sdasdass&nbsp; &nbsp; 呵呵。。。&nbsp;&nbsp;&nbsp;&nbsp;测试空格键
								</li>
							</ol>
						</p>
					</textarea>
				</form>
			</div>
			<div role="tabpanel" class="tab-pane fade" id="default">
				<form name="example" method="post">
					<textarea name="content2" style="width:900px;height:500px;visibility:hidden;"></textarea>
				</form>
			</div>
			<div role="tabpanel" class="tab-pane fade" id="block">
				<form name="example" method="post">
					<textarea name="content3" style="width:900px;height:500px;visibility:hidden;"></textarea>
				</form>
			</div>
			<div role="tabpanel" class="tab-pane fade" id="grey">
				<form name="example" method="post">
					<textarea name="content4" style="width:900px;height:500px;visibility:hidden;"></textarea>
				</form>
			</div>
			<div role="tabpanel" class="tab-pane fade" id="blue">
				<form name="example" method="post">
					<textarea name="content5" style="width:900px;height:500px;visibility:hidden;"></textarea>
				</form>
			</div>
			<div role="tabpanel" class="tab-pane fade" id="classic">
				<iframe frameborder="0" src="old.html" height="580" width="950"></iframe>
			</div>
		</div>

		<div class="row container text-left" style="margin-top: 20px;">
			<button class="btn btn-primary" id="btn">获取编辑器内容</button>
		</div>

	</div>

	<script charset="utf-8" src="NKeditor-all.js"></script>
	<!-- 如果你不需要使用批量图片上传，涂鸦功能和文件管理功能，就不需要引入 jquery -->
	<script charset="utf-8" src="libs/jquery.min.js"></script>
	<!-- JDialog是一款优秀的漂亮，轻量级的js弹出框插件 不是必须引入的，如果不引入则使用默认的 window.alert() 来弹出提示信息 -->
	<script charset="utf-8" src="libs/JDialog/JDialog.min.js"></script>
	<script src="libs/bootstrap/bootstrap.min.js"></script>
	<script>
		KindEditor.ready(function(K) {

			K.create('textarea[name="content1"]', {
				uploadJson : K.basePath+'php/qiniu/upload_json.php',
				fileManagerJson : K.basePath+'php/qiniu/file_manager_json.php',
				dialogOffset : 0, //对话框距离页面顶部的位置，默认为0居中，
				allowFileManager : true,
				items : ['source','formatblock', 'fontname', 'fontsize','forecolor','justifyleft', 'justifycenter', 'justifyright',
					'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'bold', 'italic', 'underline',
					'lineheight', 'removeformat','code', 'quote', 'plainpaste','image', 'table', 'hr', 'pagebreak','link', 'unlink',
					'preview','about'
				],
				afterChange : function() {
					this.sync();
				},
				themeType : "primary", //主题
				//错误处理 handler
				errorMsgHandler : function(message, type) {
					try {
						JDialog.msg({type:type, content:message, timer:2000});
					} catch (Error) {
						alert(message);
					}
				}
			});

			K.create('textarea[name="content2"]', {
				uploadJson : K.basePath+'php/qiniu/upload_json.php',
				fileManagerJson : K.basePath+'php/qiniu/file_manager_json.php',
				// 添加上传参数
				extraFileUploadParams : {
					name: "RockYang",
					sex: "Man"
				},
				dialogOffset : 0, //对话框距离页面顶部的位置，默认为0居中，
				allowFileManager : true,
				allowImageUpload : true,
				allowMediaUpload : true,
				//cssPath : [K.basePath+'plugins/code/prism.css'], //网编辑器中插入自定义的 css
				//jsPath: ['http://www.r9it.com/assets/themes/twitter/js/jquery-1.11.1.min.js'], // 插入自定义的脚本
				afterCreate : function() {
					var self = this;
					K.ctrl(document, 13, function() {
						self.sync();
						K('form[name=example]')[0].submit();
					});
					K.ctrl(self.edit.doc, 13, function() {
						self.sync();
						K('form[name=example]')[0].submit();
					});
				},
				showHelpGrid: true, // 是否显示输入辅助线
				themeType : "primary", //主题
				//错误处理 handler
				errorMsgHandler : function(message, type) {
					try {
						JDialog.msg({type:type, content:message, timer:2000});
					} catch (Error) {
						alert(message);
					}
				}
			});

			// black theme
			K.create('textarea[name="content3"]', {
				uploadJson : K.basePath+'php/default/upload_json.php',
				fileManagerJson : K.basePath+'php/default/file_manager_json.php',
				allowFileManager : true,
				allowImageUpload : true,
				allowMediaUpload : true,
				themeType : "black", //主题
				//错误处理 handler
				errorMsgHandler : function(message, type) {
					try {
						JDialog.msg({type:type, content:message, timer:2000});
					} catch (Error) {
						alert(message);
					}
				}
			});

			K.create('textarea[name="content4"]', {
				uploadJson : K.basePath+'php/default/upload_json.php',
				fileManagerJson : K.basePath+'php/default/file_manager_json.php',
				allowFileManager : true,
				allowImageUpload : true,
				allowMediaUpload : true,
				themeType : "grey", //主题
				//错误处理 handler
				errorMsgHandler : function(message, type) {
					try {
						JDialog.msg({type:type, content:message, timer:2000});
					} catch (Error) {
						alert(message);
					}
				}
			});

			K.create('textarea[name="content5"]', {
				uploadJson : K.basePath+'php/default/upload_json.php',
				fileManagerJson : K.basePath+'php/default/file_manager_json.php',
				allowFileManager : true,
				allowImageUpload : true,
				allowMediaUpload : true,
				themeType : "blue", //主题
				//错误处理 handler
				errorMsgHandler : function(message, type) {
					try {
						JDialog.msg({type:type, content:message, timer:2000});
					} catch (Error) {
						alert(message);
					}
				}
			});
		});

		$('#btn').click(function () {
			alert($('textarea[name="content1"]').val());
		});
	</script>
</body>
</html>