如何处理ckeditor获取焦点的问题

最新推荐文章于 2021-03-12 08:34:24 发布

qinglong332

最新推荐文章于 2021-03-12 08:34:24 发布

阅读量3.1k

点赞数

本文链接：https://blog.csdn.net/qinglong332/article/details/6881072

版权

本文介绍了在使用CKEditor时如何处理获取焦点的难题，通过设置前台TextBox的PostBackUrl属性为'#Btn'，并在需要获取焦点的textBox附近添加锚点，配合后台ImageButton的单击事件处理，实现了CKEditor在特定操作后自动聚焦。

摘要由CSDN通过智能技术生成

前台代码：

<asp:ImageButton ID="imgbtnReply1" ImageUrl="image/huifubtn.gif" AlternateText="回复" PostBackUrl="#Btn"

            runat="server" OnClick="imgbtnReply1_Click" />

主要有个属性：PostBackUrl="#Btn"

......

//要获取焦点的textBox

<asp:TextBox ID="txtContain" runat="server" TextMode="MultiLine"
                        CssClass="ckeditor" Columns="60"></asp:TextBox>

//附近加一个锚点

<a name="Btn"></a>

/*=

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

qinglong332

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

CKEditor快速介绍与入门示例

oscar999的专栏

02-06

3472

CKEditor 富文本编辑器 CKEditor 是一款知名的WYSIWYG富文本Web编辑器，WYSIWYG 的全称是what you see is what you get，也就是所见即所得。富文本是指除了可以在编辑器中输入一般的文本之外，还可以输入带有样式、格式的文本，以及上传文件以及数学公式等功能。所见即所得则可以这样理解，因为要在Web中显示一些样式，势必要用到一些HTML代码标签或者是CSS样式，对于终端的使用者来说，如果不熟悉相关语言的话，编辑代码就很困难了，所以这类编辑器中输入的内

CKeditor获取文本和焦点

qindyyx的专栏

11-22

1037

<textarea id="newsContent" class="ckeditor">${newsContent.content}</textarea> <script type="text/javascript"> var editor=CKEDITOR.replace('newsContent', { fi..

参与评论您还未登录，请先登录后发表或查看评论

ckeditor5 图片不能编辑图片不失去焦点 ckeditor5图片bug ckeditor5遇到的坑 ckeditor列表不管用

Taurus_666

07-09

1335

遇到的问题首先声明一下，我面临的问题，以及我所处的环境：当前项目是后台管理系统项目，主要用的是vue、iview、ckeditor5等。新建demo中ckeditor5运行完好，功能都很棒，可是！搬到项目中，竟然出现很多bug，主要问题有以下几个： 1、上传图片问题：图片上传后不会出现编辑图片的按钮，一直处于聚焦状态； 2、第一个问题解决后，又发现……，图片可编辑了，但是！！！如果当前编辑器...

CKEditor学习笔记4（CKEditor基本配置）

com185272358的专栏

04-30

5584

CKEDITOR.editorConfig = function( config ) { // config.language = 'fr'; // config.uiColor = '#AADC6E'; config.filebrowserBrowseUrl = '/CKEditorAndCKFinder/ckfinder/ckfinder.html' ; config.fi

ckedit控件常见问题

我的生活,我的BLOG

03-30

6340

一.ckeditor 3.0.1精简精简前:4.52M 精简后:853K1.删除_samples和_source文件夹,分别为示例文件和未压缩源程序2.删除lang文件夹下除zh-cn.js,en.js下的所有语言文件.根据需要删除3.删除根目录下的changes.html(更新列表),install.html(安装指向),license.html(使用许可).4.删除skins目录下

关于ckeditor在bootstrap中modal中弹框无法输入的解决方法

10-16

这段脚本的作用是修复CKEditor在模态框中的焦点问题。具体实现原理如下： 1. 监听文档上的'focusin.modal'事件，这个事件是在模态框的上下文中触发的焦点变化事件。 2. 在事件处理函数中，首先获取触发焦点事件的...

html富文本编辑器ckeditor最新版

03-21

5. **事件处理**：CKEditor支持多种事件，如`instanceReady`（编辑器加载完成）、`blur`（编辑器失去焦点）等，可以通过监听这些事件来执行自定义逻辑。 6. **数据交互**：CKEditor提供了获取和设置编辑器内容的...

CKEditor使用介绍.doc

09-07

26. **StartupFocus**: `true`表示编辑器在启动时自动获取焦点，方便用户立刻开始输入。 27. **StylesXmlPath**: 定义CSS样式的XML文件路径，用于自定义样式集。 28. **TabSpaces**: 指定按下TAB键时插入的空格数...

Ckeditor失去焦点前保留光标位置

weixin_30823683的博客

02-28

1143

var $selection = CKEDITOR.instances.myEditor.getSelection();//当前选中区域 var $bookmarks = $selection.createBookmarks2();//当前光标 $selection.selectBookmarks($bookmarks);//还原光标位置转载于:https:...

CKEditor与CKFinder学习--自定义界面及按钮事件捕获

程高伟

03-21

7879

上一篇博客写了如何搭建CKEditor与CKFinder环境，并将其与SpringMVC进行整合，现在学习如何进行界面的定义，以及界面元素的操作。效果图界面操作图原始界面调整后的界面（删除了flush，表单元素等）该界面的皮肤是bootstrap的皮肤事件操作图获取界面上保存按钮点击事件效果用js操作ckeditor控制的textarea自定义界面ckeditor默认使用moono皮肤

在vue的里面利用ckeditor进行光标插入短代码

weixin_34313182的博客

11-01

590

2019独角兽企业重金招聘Python工程师标准>>> ...

解决编辑框移动端不能获取焦点的问题 --- 针对 wangeditor 编辑器

overflow_mo的博客

04-18

2053

解决编辑框移动端不能获取焦点的问题 FastClick.prototype.needsClick = function (target) { if (target.className.indexOf('w-e') !== -1) { return true } if (target.parentElement) { return this.needsClick(targe...

Ckeditor注册事件

weixin_33724659的博客

08-27

195

这段时间使用js+cookies进行自动草稿保存，个人觉的，这些全在客户端处理比较的好，所以没有使用AJAX+数据库的自动草稿保存方法。结果出现Ckeditor无法绑定onkeyup，onselect，onclick事件的问题，查看了Ckeditor的API，发现如下说明： instanceReady.ckeditor:firedwhentheeditoriscreat...

vue获取焦点、失去焦点