700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 富文本编辑器simditor的使用

富文本编辑器simditor的使用

时间:2021-01-21 23:54:03

相关推荐

富文本编辑器simditor的使用

首先在web工程的webapps目录下创建一个文件夹,在这里我是用simditor,如下图:

去官网下载文件

2.3.6版本有单独的simditor-2.3.6.zip可以下载,点击下面的链接:

https://simditor.tower.im/docs/doc-usage.html

此处要注意的是如果你是下载的源码,只要在simditor-2.3.8\site\assets中引入下面三个目录的内容即可:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %><%@ taglib uri="/jsp/jstl/core" prefix="c"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><base href="<%=basePath%>"> <title>添加用户</title> <link href="/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"><!-- 开始 --><link rel="stylesheet" type="text/css" href="simditor/styles/simditor.css" /><script type="text/javascript" src="simditor/scripts/jquery.min.js"></script><script type="text/javascript" src="simditor/scripts/module.js"></script><script type="text/javascript" src="simditor/scripts/hotkeys.js"></script><script type="text/javascript" src="simditor/scripts/uploader.js"></script><script type="text/javascript" src="simditor/scripts/simditor.js"></script><script type="text/javascript">var editor = new Simditor({textarea: $('#editor')//optional options});$(function(){Simditor.locale = 'zh-CN';//设置中文var editor = new Simditor({textarea: $('#editor'), //textarea的idplaceholder: '这里输入文字...',toolbar: ['title', 'bold', 'italic', 'underline', 'strikethrough', 'fontScale', 'color', '|', 'ol', 'ul', 'blockquote', 'code', 'table', '|', 'link', 'image', 'hr', '|', 'indent', 'outdent', 'alignment'], //工具条都包含哪些内容pasteImage: true,//允许粘贴图片defaultImage: '/res/simditor/images/image.png',//编辑器插入的默认图片,此处可以删除upload : {url : 'richtext_img_upload.do', //文件上传的接口地址params: null, //键值对,指定文件上传接口的额外参数,上传的时候随文件一起提交fileKey: 'upload_file', //服务器端获取文件数据的参数名connectionCount: 3,leaveConfirm: '正在上传文件'}});</script><!-- 结束 --><script type="text/javascript"> function addArticle(){ var form = document.forms[0]; form.action = "<%=basePath%>article/addArticle?userId=${userId}"; form.method="post"; form.submit(); } </script></head><body><div class="container-fluid"><h1><%=path%>添加用户<%=basePath%></h1> <form action="" name="userForm"> 标题:<input type="text" name="title"> <!-- 正文:<textarea name="content" clos=",50" rows="5" warp="virtual"></textarea> --><!-- <input type="textarea" name="content" style="width:300px;height:100px;"/> --><!-- 开始 --><div class="row cl"><label class="form-label col-xs-4 col-sm-2">文章内容:&nbsp;</label><div class="formControls col-xs-8 col-sm-9"><textarea id="editor" type="text/plain" name="content" style="width:100%;height:400px;"autofocus></textarea></div></div><!-- 结束 --><input type="button" value="添加" onclick="addArticle()"> </form></div></body></html>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。