Django CKEditor未保存窗口关闭提醒

在使用文本编辑器写博客时,有时可能不小心将页面关闭,或者刷新页面,来不及保存的博文就会消失的无影无踪,令人感到十分沮丧。

如果使用Django CKEditor文本编辑器,只需添加一个js插件并进行简单的配置就可以防止不小心关闭表单尚未保存页面的情况,设置步骤如下:

1. 添加jquery.AreYouSure插件,该插件可以在关闭包含未保存表单的页面时弹出相应提示,Github项目地址为:https://github.com/codedance/jquery.AreYouSure。

2. 修改ckeditor\templates\ckeditor\widget.html,将内容替换为下面的代码:

<p><textarea{{ final_attrs|safe }}>{{ value }}</textarea></p>
<script type="text/javascript" src ...

继续阅读

使用zTree绘制行政区划树状图

zTree是一款基于jQuery的js树形插件,可以将树形结构的数据以可折叠的树状图的形式进行展现,该组件的Github项目地址为:https://github.com/zTree/zTree_v3

本文以行政区划树状图为例,简述zTree插件的使用过程。

访问国家民政部网站的URL:http://www.mca.gov.cn/article/sj/tjbz/a/2016/201605/20160506281034.html,可以查看2016年5月中华人民共和国县以上行政区划代码。

访问国家统计局网站的URL:http://www.stats.gov.cn/tjsj/tjbz/xzqhdm/201504/t20150415_712722.html,即可浏览最新县及县以上行政区划代码(截止2014年10月31日)。

将页面上的行政区划正文复制并保存在一个文本文件中 ...

继续阅读

CKEditor允许输入空标签配置方法

使用CKEditor编辑HTML文本时,有时可能需要插入带有样式的空标签,例如显示glyphicons图标的<i>标签:

<i class="glyphicon glyphicon-user"></i>

但是,默认设置下,CKEditor会过滤掉空的<i>标签。

在ckeditor.config.js中添加如下代码即可实现在CKEditor (4.3.x)编辑器中插入一个带有样式的空的<i>标签:

// allow i tags to be empty (for font awesome)
config.protectedSource.push(/<i[^>]><\/i>/g);
CKEDITOR.dtd.$removeEmpty['i'] = false;
config ...

继续阅读

jQuery事件重复绑定示例及解决方法

jQuery嵌套事件绑定时,如果逻辑处理不当,有时会出现事件重复绑定的问题,例如下面的例子。

点击“添加文本框”按钮时,会在div中新增一个textarea,同时使用bind方法为class为demo-textarea的元素绑定click事件

jQuery事件重复绑定Demo,点击“新增文本框”按钮追加textarea
点击textarea弹出提示,重复添加时会重复绑定 ...

继续阅读

年度归档