ThinkPHP6.0의 리치 텍스트 편집기 wangEditor3 사용 정보
- 藏色散人앞으로
- 2020-11-01 16:19:413823검색
다음 튜토리얼 칼럼인 ThinkPHP에서는 ThinkPHP6.0에서 리치 텍스트 편집기 wangEditor3를 사용하는 방법을 소개하겠습니다. 도움이 필요한 친구들에게 도움이 되길 바랍니다!
UEditor는 Baidu 웹 프런트엔드 R&D 부서에서 개발한 WYSIWYG 리치 텍스트 웹 편집기입니다.
가벼우며 사용자 정의가 가능하며 사용자 경험에 중점을 둔 오픈 소스는 MIT 라이선스를 기반으로 하여 무료로 사용하고 수정할 수 있습니다. 코드.
아쉽게도 공식 홈페이지에서 다운로드하는 속도가 너무 느리고, 인터페이스가 약간 복고풍이어서 포기하고 가벼운 wangEditor3를 사용했습니다.
1 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>wangEditor demo</title>
</head>
<body>
<p id="editor">
<p>欢迎使用 <b>wangEditor</b> 富文本编辑器</p>
</p>
<!-- 注意， 只需要引用 JS，无需引用任何 CSS ！！！-->
<script type="text/javascript" src="/wangEditor.min.js"></script>
<script type="text/javascript">
var E = window.wangEditor
var editor = new E('#editor')
// 或者 var editor = new E( document.getElementById('editor') )
editor.create()
</script>
</body>
</html>
이미지 업로드 옵션은 base64 인코딩을 사용하여 이미지를 콘텐츠에 직접 삽입하므로 로컬 업로드를 구성할 필요가 없습니다.
Ajax가 사용되지 않으므로 숨겨진 텍스트 상자가 양식에 추가됩니다
<input id="content" name="content" type="hidden">Configuration
함수 실행. 제출 시 리치 텍스트 콘텐츠도 함께 제출됩니다.
3. 데이터베이스에 텍스트 저장
위 내용은 ThinkPHP6.0의 리치 텍스트 편집기 wangEditor3 사용 정보의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!