圆月山庄资源网 Design By www.vgjia.com
富文本
1、Rich Text Format(RTF)
微软开发的跨平台文档格式,大多数的文字处理软件都能读取和保存RTF文档,其实就是可以添加样式的文档,和HTML有很多相似的地方
图示
2、tinymce插件
安装插件
pip install django-tinymce
配置插件
使用
后台管理中
HTMLField
页面中使用
textarea
3、在后台管理中使用
配置settings.py文件
INSTALLED_APPS 添加 tinymce 应用 INSTALLED_APPS = [ ... # 注册富文本应用 'tinymce', ]
添加默认配置
# 以字典形式配置富文本框架tinymce # 作用于管理后台中的富文本编辑器 TINYMCE_DEFAULT_CONFIG = { # 使用高级主题,备选项还有简单主题 'theme': 'advanced', # 'theme': 'simple', # 必须指定富文本编辑器(RTF=rich text format)的宽高 'width': 800, 'height': 600, # 汉化 'language': 'zh', # 自定义常用的固定样式 'style_formats': [ # title=样式名称 # styles=自定义css样式 # inline:xxx = 将加样式后的文本放在行内元素中显示 # block:xxx = 将加样式后的文本放在块级元素中显示 {'title': 'Bold text', 'inline': 'b'}, {'title': 'Red text', 'inline': 'span', 'styles': {'color': '#ff0000'}}, {'title': 'Red header', 'block': 'h1', 'styles': {'color': '#ff0000'}}, {'title': 'Example 1', 'inline': 'span', 'classes': 'example1'}, {'title': 'Example 2', 'inline': 'span', 'classes': 'example2'}, {'title': 'Table styles'}, {'title': 'Table row 1', 'selector': 'tr', 'classes': 'tablerow1'} ], }
创建模型类
from tinymce.models import HTMLField class Blog(models.Model): sBlog = HTMLField()
注册模型
admin.site.register
4、在普通页面使用
使用文本域盛放内容
<form method='post' action='url'> <textarea></textarea> </form>
添加脚本
<script src='/static/tiny_mce/tiny_mce.js'></script> <script> tinyMCE.init({ 'mode': 'textareas', 'theme': 'simple', 'theme': 'advanced', 'width': 800, 'height': 600, 'language': 'zh', 'style_formats': [ {'title': 'Bold text', 'inline': 'b'}, {'title': 'Red text', 'inline': 'span', 'styles': {'color': '#ff0000'}}, {'title': 'Red header', 'block': 'h1', 'styles': {'color': '#ff0000'}}, {'title': 'Example 1', 'inline': 'span', 'classes': 'example1'}, {'title': 'Example 2', 'inline': 'span', 'classes': 'example2'}, {'title': 'Table styles'}, {'title': 'Table row 1', 'selector': 'tr', 'classes': 'tablerow1'} ], }) </script>
本质上还是使用html的样式。
5、利用js获取富文本内容和设置内容给富文本
//editorId是富文本的id function SetTinyMceContent(editorId, content) { //给富文本编辑器设置内容 tinyMCE.getInstanceById(editorId).getBody().innerHTML = content; //获取富文本编辑器的内容 var con = tinyMCE.getInstanceById(editorId).getBody().innerHTML; }
补充知识:Django中Form的Textarea字段
开始以为是这个样子:
class BlogForm(forms.Form): title = forms.CharField(required = True) content = forms.Textarea()
查看文档发现是:
from django import forms class BlogForm(forms.Form): title = forms.CharField(required = True) content = forms.CharField(widget=forms.Textarea)
以上这篇Django之富文本(获取内容,设置内容方式)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
标签:
Django,富文本
圆月山庄资源网 Design By www.vgjia.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
圆月山庄资源网 Design By www.vgjia.com
暂无评论...
RTX 5090要首发 性能要翻倍!三星展示GDDR7显存
三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。
首次推出的GDDR7内存模块密度为16GB,每个模块容量为2GB。其速度预设为32 Gbps(PAM3),但也可以降至28 Gbps,以提高产量和初始阶段的整体性能和成本效益。
据三星表示,GDDR7内存的能效将提高20%,同时工作电压仅为1.1V,低于标准的1.2V。通过采用更新的封装材料和优化的电路设计,使得在高速运行时的发热量降低,GDDR7的热阻比GDDR6降低了70%。
更新日志
2024年11月02日
2024年11月02日
- 伍佰.2002-冬之火九重天演唱会特选录音专辑2CD【滚石】【WAV+CUE】
- 李宗盛1996《李宗盛的凡人歌2CD》滚石[WAV+CUE][1G]
- 刘德华 《天意》1:1直刻黑胶LPCD[WAV+CUE][1.1G]
- 刘德丽2024《赤的疑惑HQCD》头版限量编号MQA[低速原抓WAV+CUE]
- 英雄联盟万圣节有什么皮肤返场 2024万圣节皮肤返场一览
- lol万圣节赠礼活动什么时候开始 2024万圣节活动时间介绍
- 2024全球总决赛blg是全华班吗 全球总决赛blg选手所属国家介绍
- 《LOL》S14半决赛:T1战胜GEN晋级决赛!对决BLG
- 《完蛋美女前传》白白演员抱怨:都没人玩我的线
- 玩家热议OLED屏对画面提升巨大:比PS5 Pro值得买
- PatriciaPaay-TheLadyIsAChamp(ExpandedEdition)(2024)[24Bit-96kHz]FLAC
- 尚士达.2024-莫回头【智慧小狗】【DTS-WAV分轨】
- 区瑞强-黄金时代HQCDII头版限量wav
- 孙露《终于等到你》[WAV分轨][488M]
- 张信哲《歌时代》 潮水音乐 [WAV+CUE]