热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

在线编辑器中换行与内容自动提取

这几天在写在线编辑器,碰到个问题,当使用回车换行时不是你希望的<br>而是<p><p>对或是<div><div>对。使用google搜索,在网上找不到满意的答案。
有的是使用“return false”解决了ie的插入
问题,但是firefox并没有解决。而且这个问题连fckeditor都没解决。呵呵,不知是否有意为之。
可能看了以上的描述还不太明白什么问题。我们做个实验,打开fckeditor切换到源码模式输入
test test test test test test
,再切换回设计模式,然后在这句的任意地方输入个回车,比如在第3个test后,你会发现源码内得到的是
test test test
test test test
,并且如果是
这形式,自动生成的也是这种形式,这样会增加许多无用代码,而且这问题在我所能找到的在线编辑器都有。
为什么一定要使用
换行呢?简单,而且灵活不像

换行空行间距大,需要大空行多输入几个回车就行。而且假如使用自动提取文章部分内容的话不怕tag没有闭包(可能'
'别切割,但只有很少的内容,显示不正常。而且'
'被切割中的概率很低,除非使用连续多个
,当然这也很容易修补)。这样在使用自定义层时可以使用

,好处是不怕被切割而使得tag没有闭包。这样可以避免使用

。如果使用
的话自动截取的文章内容而使得有个
没有闭包(如果一个div内的内容多,这情况很容易出现),将会对整个页面效果产生不好的影响。而去除tag,再截取内容的话也不是一个好选择,比如csdn的blog就是先去除了tag,然后截取文章,这个效果大家都看到了,肯定不好。当然如果要保证tag的完整,比如img,a还有些工作要做,那也会简单得多。记住通过这样处理后在截取文章内容存入数据库还要对用户可能使用源码编辑的
标签替换为

标签。
到底如何能得到

test test test
test test test
呢?
呵呵,问题的解决其实也很简单。那就是屏蔽浏览器的默认动作,而不是return false(网上搜得到这种方式,但这只能解决ie下的问题)。
使用onkeydown事件绑定函数(兼容ie,firefox)
function cancelEnter (e)
{
var keyCode = e.charCode || e.keyCode;
if(keyCode == 13)
{
// 此处使用插入字符函数加上
(当然也可以是其他)比如document.execCommand(cmd, false, '
');
// 注意ie不支持这个command
// 由于实现可能是iframe或div代码有所不同,看您的具体情况(要兼容ie,firefox这里也一定需要兼容)
// 在网上也能搜索到代码就不多说了
if(e.preventDefault) e.preventDefault(); // 禁止浏览器默认动作(这里是关键)
else e.returnValue = false;
}
}
这样就可以得到
test test test
test test test

推荐阅读
  • Android Studio Bumblebee | 2021.1.1(大黄蜂版本使用介绍)
    本文介绍了Android Studio Bumblebee | 2021.1.1(大黄蜂版本)的使用方法和相关知识,包括Gradle的介绍、设备管理器的配置、无线调试、新版本问题等内容。同时还提供了更新版本的下载地址和启动页面截图。 ... [详细]
  • Pycharm编辑器取消双击shift弹出搜索框的方法
    在使用Pycharm编辑器时,双击shift会弹出搜索框界面,导致输入失去焦点,给用户带来不便。本文介绍了取消双击shift弹出搜索框的方法:在Pycharm中双击shift,输入registry并回车,找到“ide.suppress.double.click.handler”并勾选后,关闭即可解决该问题。通过这个方法,你再也不会被shift问题困扰了。 ... [详细]
  • 如何使用迅捷PDF编辑器给PDF文件设置全屏动画
    本文介绍了使用迅捷PDF编辑器给PDF文件设置全屏动画的方法,包括安装软件、添加PDF文件、设置动画效果和页面范围等步骤,帮助用户实现PDF文件的全屏动画效果。操作简单,适用于华为全屏等设备。 ... [详细]
  • 本文介绍了Linux系统中正则表达式的基础知识,包括正则表达式的简介、字符分类、普通字符和元字符的区别,以及在学习过程中需要注意的事项。同时提醒读者要注意正则表达式与通配符的区别,并给出了使用正则表达式时的一些建议。本文适合初学者了解Linux系统中的正则表达式,并提供了学习的参考资料。 ... [详细]
  • PDF内容编辑的两种小方法,你知道怎么操作吗?
    本文介绍了两种PDF内容编辑的方法:迅捷PDF编辑器和Adobe Acrobat DC。使用迅捷PDF编辑器,用户可以通过选择需要更改的文字内容并设置字体形式、大小和颜色来编辑PDF文件。而使用Adobe Acrobat DC,则可以通过在软件中点击编辑来编辑PDF文件。PDF文件的编辑可以帮助办公人员进行文件内容的修改和定制。 ... [详细]
  • 本文讨论了在PHP中将空格转换为问号的问题,并提供了解决方案。文章指出,空格不是标准的空格,而是特殊的0xC2 0xA0字符。作者尝试使用mb_convert_encoding函数将utf8字符串转换为gbk编码,但未成功。文章建议检查编辑器是否对空格进行了特殊处理,并提供了使用base64_encode函数打印结果的方法。最后,给出了完整的代码示例。 ... [详细]
  • 本文详细介绍了Vim编辑器中的三种模式(命令模式、末行模式和编辑模式)以及它们之间的操作区别和切换方法。Vim编辑器凭借其多种命令快捷键和高效率的操作方式,得到了广大厂商和用户的认可。对于想要高效操作文本的用户来说,了解这些模式的使用方法是必不可少的。 ... [详细]
  • 本文讨论了编写可保护的代码的重要性,包括提高代码的可读性、可调试性和直观性。同时介绍了优化代码的方法,如代码格式化、解释函数和提炼函数等。还提到了一些常见的坏代码味道,如不规范的命名、重复代码、过长的函数和参数列表等。最后,介绍了如何处理数据泥团和进行函数重构,以提高代码质量和可维护性。 ... [详细]
  • 本文介绍了三种方法来关闭win7电脑开机硬盘自检,分别是使用命令提示符、注册表编辑器和bios设置界面。通过取消硬盘自检可以加快电脑启动速度。详细步骤和操作说明在正文中有详细介绍。 ... [详细]
  • Win7系统如何实现Ctrl+Alt+Del热键组合呼出任务管理器
    本文介绍了在Win7系统中如何通过组策略编辑器设置,实现Ctrl+Alt+Del热键组合呼出任务管理器的方法。通过删除原有的项目并设置呼出任务管理器,用户可以方便地使用Ctrl+Alt+Del热键组合来打开任务管理器。 ... [详细]
  • 本文介绍了一个免费的asp.net控件,该控件具备数据显示、录入、更新、删除等功能。它比datagrid更易用、更实用,同时具备多种功能,例如属性设置、数据排序、字段类型格式化显示、密码字段支持、图像字段上传和生成缩略图等。此外,它还提供了数据验证、日期选择器、数字选择器等功能,以及防止注入攻击、非本页提交和自动分页技术等安全性和性能优化功能。最后,该控件还支持字段值合计和数据导出功能。总之,该控件功能强大且免费,适用于asp.net开发。 ... [详细]
  • OC渲染器和阿诺德渲染器的特点及适用范围
    本文介绍了C4D软件自带的渲染器效果较差的问题,并推荐了四款C4D渲染器,其中包括OC渲染器和阿诺德渲染器。OC渲染器渲染速度快,简单易用,特别适合小团队和个人使用,而阿诺德渲染器具有超快的预览功能和真实的渲染效果,适合在体积光处理方面使用。两款渲染器都支持多个C4D版本和不同操作系统。 ... [详细]
  • 如何实现JDK版本的切换功能,解决开发环境冲突问题
    本文介绍了在开发过程中遇到JDK版本冲突的情况,以及如何通过修改环境变量实现JDK版本的切换功能,解决开发环境冲突的问题。通过合理的切换环境,可以更好地进行项目开发。同时,提醒读者注意不仅限于1.7和1.8版本的转换,还要适应不同项目和个人开发习惯的需求。 ... [详细]
  • 如何更改电脑系统的自动校时服务器地址?
    本文介绍了如何通过注册表编辑器更改电脑系统的自动校时服务器地址。通过修改注册表中的数值数据或新建字符串数值的方式,可以将默认的时钟同步服务器地址更改为自己所需要的域名或IP地址。详细步骤包括双击时间区域,点击internet时间,勾选自动校正域名设置定时等操作。 ... [详细]
  • OCI连接MySQL_PLSQL Developer连接远程数据库OCI客户端安装方法
    本文介绍了使用OCI客户端连接MySQL和PLSQL Developer连接远程数据库的安装方法,避免了在本地安装Oracle数据库或类似的开发套件的麻烦,同时解决了PLSQL Dev连接远程Oracle时的配置问题。 ... [详细]
author-avatar
手机用户2502893535
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有