Python全系列 教程
3567个小节阅读:5930.5k
目录
鸿蒙应用开发
C语言快速入门
JAVA全系列 教程
面向对象的程序设计语言
Python全系列 教程
Python3.x版本,未来主流的版本
人工智能 教程
顺势而为,AI创新未来
大厂算法 教程
算法,程序员自我提升必经之路
C++ 教程
一门通用计算机编程语言
微服务 教程
目前业界流行的框架组合
web前端全系列 教程
通向WEB技术世界的钥匙
大数据全系列 教程
站在云端操控万千数据
AIGC全能工具班
A A
White Night
文档地址:https://www.tiny.cloud/docs/tinymce/6/basic-setup/
创建项目
xxxxxxxxxx
django-admin startproject demo
增加子应用
xxxxxxxxxx
python manage.py startapp edit_app
添加子应用与ckeditor子应用
xxxxxxxxxx
# settings.py
INSTALLED_APPS = [
'ckeditor',
'edit_app',
'...'
]
设置模板目录
xxxxxxxxxx
# settings.py
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
增加逻辑视图
xxxxxxxxxx
# views.py
from django.shortcuts import render
from django.http import HttpResponse
from .models import Article
# Create your views here.
def index(request):
if request.method =='GET':
return render(request, 'index.html')
elif request.method =='POST':
# 获取标题
title = request.POST.get('title')
# 获取内容
content = request.POST.get('content')
# 创建对象
article = Article(title=title, content=content)
# 保存数据
article.save()
# 返回响应
return HttpResponse('保存成功')
增加路由
xxxxxxxxxx
# urls.py
from django.urls import path
from . import views
urlpatterns = [
path('edit/', views.index, name='index'),
]
设置页面
加载静态文件与设置表单
xxxxxxxxxx
<script src="https://cdn.ckeditor.com/ckeditor5/35.3.2/classic/ckeditor.js"></script>
<form action="" method="post">
{% csrf_token %}
标题1:<input type="text" name="title" value="{{info.title}}"><br>
<textarea cols="20" rows="2" name="content" id="editor">{{info.content}}</textarea>
<input type="submit" value="Submit">
</form>
在页面增加JS控制即可
参考地址:https://www.tiny.cloud/docs/tinymce/6/toolbar-configuration-options/
xxxxxxxxxx
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/6/tinymce.min.js"></script>
</head>
<body>
<form action="/edit/" method="post">
{% csrf_token %}
标题1:<input type="text" name="title" value="{{info.title}}"><br>
<textarea cols="20" rows="2" name="content" id="editor">{{info.content}}</textarea>
<input type="submit" value="Submit">
</form>
</body>
<script>
tinymce.init({
selector: "#editor",
height: '250px',
toolbar: 'formatselect | bold italic underline | badge table | code',
});
</script>
</html>
实时学习反馈
1. 关于自定义页面使用Django富文本编辑器功能说法错误的是?
A tinymce自定义功能需要使用js对象初始化
B 通过样式表tinymce来加载富文本
C 需要模板加载tinymce静态文件js
D 富文本的功能通过toolbar设置
答案
1=>B