如何实现⽤将富⽂本编辑器内容保存为txt⽂件并展⽰
1.实现思路
创建⼀个xx.txt⽂件，存放于项⽬路径下
⽤⽂件流去读取⽂件内容并将读取的内容存放到页⾯的富⽂本编辑器框内
富⽂本编辑框内容改变后，保存时⽤⽂件流的⽅式保存到xx.txt⽂件中
提⽰：注意编码问题，否则容易出现中⽂乱码
2.页⾯展⽰
编辑器默认为禁⽌编辑状态，点击编辑按钮时可编辑内容，编辑完成后，点击保存按钮即可完成。
3.前端代码
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge" charset="UTF-8"/>
<title>企业介绍</title>
<!-- 引⼊公共资源 -->
<script th:replace="comm/comm::head"></script>
<link th:href="@{/boot/styles/learun-child.css}" rel="stylesheet"/>
<script th:src="@{/boot/scripts/plugins/datepicker/DatePicker.js}"></script>
<script type="text/javascript"
th:src="@{/boot/scripts/plugins/fig.js}"></script>
<script type="text/javascript"
th:src="@{/boot/scripts/plugins/UEditor/ueditor.all.js}"></script>
<script type="text/javascript"
th:src="@{/boot/scripts/plugins/UEditor/lang/zh-cn/zh-cn.js}"></script>
<link th:href="@{/boot/scripts/plugins/jquery-ui/bootstrap-select.css}"
rel="stylesheet"/>
<script th:src="@{/boot/scripts/plugins/jquery-ui/bootstrap-select.js}"></script>
<style>
body {
height: 100%;
width: 100%;
margin-left: 20px;
}
</style>
</head>
<body>
<div class="ui-layout" id="vpapp" >
<div class="ui-layout-center">
<div id="div_right" class="ul_d_right"
>
<div class="show_tilte">系统管理 > 企业介绍</div>
<div class="toolsbutton">
<div class="childtitlepanel">
<div class="title-search">
<table>
<tr>
<td >
<!--                                    <a id="btn_Search" class="btn btn-danger" v-on:click="serach" ><i class="fa fa-search"></i> ；查询</a> -->
</td>
</tr>
</table>
</div>
<div class="toolbar" id="edit">
<a id="item-edit" class="btn btn-default" onclick="item_edit()"><i
class="fa fa-pencil-square-o"></i> ；编辑</a>
</div>
<div class="toolbar" id="save" >
<a id="item-save" class="btn btn-default" onclick="item_save()"><i
class="fa fa-pencil-square-o"></i> ；保存</a>
</div>
</div>
</div>
<div class="gridPanel">
<table id="gridTable">
<tr>
<td class="formValue" colspan="3"    >
<textarea    class="form-control" id="coursecontent"    th:utext="${words?:''}"></textarea>
</td>
</tr>
</table>
<div id="gridPager"></div>
</div>
</div>
</div>
</div>
<script th:src="@{/js/company/company_index.js}"></script>
</body>
</html>
js代码：
var editor;
$(function(){
editor = UE.getEditor('coursecontent',{
readonly: true
});
//    setTimeout(() => {
//        editor.disable();
//    }, 3000);
});
/
/编辑
function item_edit(){
$('#edit').attr("style","display:none;");
$("#save").attr("style","display:block;");
}
//保存
function item_save(){
$.ajax({
url: basePath + "/company/company_save",
data:{
words: encodeURI(Content()))
},
type: 'post',
dataType: 'json',
success(result){
de == '1') {
dialogMsg('保存成功！', 0);
$('#edit').attr("style","display:block;");
$("#save").attr("style","display:none;");
editor.disable();
}else{
dialogMsg('保存失败！', 0);
}
}
});
}
4.后台代码
dulespany;
import java.io.*;
import java.URLDecoder;
import org.apachemons.lang3.StringUtils;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
mon.utils.JsonResult;
@Controller
@RequestMapping("/company")
public class CompanyController {
private static String path  = ClassLoader().getResource("").getPath();
@RequestMapping("/list")
public String list(Model model) {
String string = readWord();
if(StringUtils.isNotEmpty(string)) {
model.addAttribute("words", string);
}
return "company/company_index";
}
/**
* 读取⽂件内容
*/
public static String readWord ()  {
try (
FileInputStream  fileInputStream = new FileInputStream(URLDecoder.decode(path, "UTF-8")+"static\\company\\企业介绍.txt");
InputStreamReader inputStreamReader = new InputStreamReader(fileInputStream,"UTF-8");
BufferedReader br = new BufferedReader(inputStreamReader);
){
String line = null;
StringBuffer sBuffer = new StringBuffer();
while((line = br.readLine())!=null){
sBuffer.append(line);
}
String();
asp富文本编辑器
} catch (IOException e) {
e.printStackTrace();
throw new RuntimeException(e);
}
}
/**
* 书写⽂件内容
*/
public static void writeWord(String str) throws IOException {
try (
FileOutputStream fileOutputStream = new FileOutputStream(URLDecoder.decode(path, "UTF-8")+"static\\company\\企业介绍.txt");                OutputStreamWriter outputStreamWriter = new OutputStreamWriter(fileOutputStream,"UTF-8");
PrintWriter out = new PrintWriter(outputStreamWriter);
){
out.write(str);
out.flush();
} catch (IOException e) {
e.printStackTrace();
throw new RuntimeException(e);
}
}
/**
* 保存
*/
@RequestMapping("/company_save")
@ResponseBody
public JsonResult companySave(String words) {
try {
String content = URLDecoder.decode(URLDecoder.decode(words, "UTF-8"), "UTF-8");
writeWord(content);
return JsonResult.success();
} catch (IOException e) {
e.printStackTrace();
();
}
}
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。