master

分支 (1)

管理

管理

master

layui-admx
/
tinymce.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta name="renderer" content="webkit|ie-comp|ie-stand">
  <title>TinyMCE</title>
  <link rel="stylesheet" href="static/layui-v2.5.6/layui/css/layui.css" media="all">
</head>
<body>
	<form class="layui-form" lay-filter="formTinyMCE" action="admin.html">
		<div class="layui-form-item">
			<label class="layui-form-label">文本框</label>
			<div class="layui-input-block">
			   <input type="text" name="title" required  lay-verify="required" placeholder="" autocomplete="off" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">选择框</label>
			<div class="layui-input-block">
			   <textarea name="tinyMCE" id="tinyMCE">这里是<span style="color: #e03e2d;"><em>edit初始化</em></span>的内容</textarea>
			</div>
		</div>
		<div class="layui-form-item">
		  <div class="layui-input-block">
			<button type="submit" class="layui-btn" lay-submit lay-filter="formDemo">登录</button>
			<button type="reset" class="layui-btn layui-btn-primary">重置</button>
		  </div>
		</div>
	</form>

<script src="static/layui-v2.5.6/layui/layui.all.js"></script>
<script>
layui.extend({
	tinymce: './static/layui-v2.5.6/layui/lay/extends/tinymce/tinymce'
}).use(['form',"jquery","tinymce","util"], function(){
    var $ = layui.jquery
		,tinymce = layui.tinymce
		,form = layui.form;

    tinymce.render({
		elem: "#tinyMCE"
		, height: 600
		, width:1000
		,language:'zh_CN'
		,toolbar: 'undo redo removeformat painterformat|fontselect fontsizeselect styleselect bold forecolor hilitecolor italic|image images table link '
		,menubar: false
		,images_upload_credentials:true//对images_upload_url中指定的地址调用时是否传递cookie等跨域的凭据。值为布尔值，默认false。
		,images_upload_url:'http://192.168.26.7/api/uploadTinymce'//后台返回路径必须是http或https路径否则不能正常回显
		,paste_data_images: true, // 设置为“true”即允许粘贴图像，而将其设置为“false”则不允许粘贴图像
	},function(opt){
	});

	form.val('formTinyMCE',{
		tinyMCE:'点击按钮设置的内容：<span style="color: #e03e2d;">' + new Date()+'</span>'
	})

	form.on('submit(formDemo)', function(data){
	  var data2 = data.field;
	  console.log('富文本赋值前',data2);
	  data2.tinyMCE = tinymce.get('#tinyMCE').getContent();
	  console.log('富文本赋值前',data2);
	  return false;
	});
});
</script>
</body>
</html>