之前在网上也找过类似的资料,国内网站介绍的都是老掉牙的方法不兼容标准浏览器。正确的方法是正确运用Selection对象和Range对象,实现在光标当前位置插入文本或结点。但是这两个对象在IE和标准的DOM方式的运用方法是不同的。
思路:首先获得用户的选区(光标当前位置可理解成起始和终止位置一样的选区)。然后,从Selection对象转成Range对象。目的是利用Range对象的方法插内容进去。最后,插入动作结束后将光标移到插入内容的后面。
实现:IE下的Selection对象,var sel = win.document.selection;
DOM方式的Selection对象,var sel = win.getSelection();
var range = sel.createRange(); //IE下
var range = sel.getRangeAt(0); //DOM下
if(range.startContainer){ //DOM下
sel.removeAllRanges(); //删除Selection中的所有Range
range.deleteContents(); //清除Range中的内容
//获得Range中的第一个html结点
var container = range.startContainer;
//获得Range起点的位移
var pos = range.startOffset;
//建一个空Range
range = document.createRange();
//插入内容
var cons = win.document.createTextNode(",:),");
if(container.nodeType == 3){//如是一个TextNode
container.insertData(pos, cons.nodeValue);
//改变光标位置
range.setEnd(container, pos + cons.nodeValue.length);
range.setStart(container, pos + cons.nodeValue.length);
}else{//如果是一个HTML Node
var afternode = container.childNodes[pos];
container.insertBefore(cons, afternode);
range.setEnd(cons, cons.nodeValue.length);
range.setStart(cons, cons.nodeValue.length);
}
sel.addRange(range);
}
else{//IE下
var cnode = range.parentElement();
while(cnode.tagName.toLowerCase() != "body"){
cnode = cnode.parentNode;
}
if(cnode.id && cnode.id=="rich_txt_editor"){
range.pasteHTML(",:),");
}
}
win.focus();
[DEMO] http://listenpro.googlepages.com/editor_demo_insert.html
转载:http://blog.360.yahoo.com/blog-sOW1QOA9crUyOdXFxOeK4xc-?cq=1&p=55#comments
分享到:
相关推荐
在标签“禁用触摸板”中,我们可以理解这个操作的主要目的是提高工作效率,特别是在需要精细操作或者长时间使用鼠标时,避免意外触碰触摸板导致光标移动。此外,对于那些不习惯或者不喜欢使用触摸板的用户来说,这也...
在PowerPoint 2010中,插入表格是一项重要的功能,可以帮助用户组织信息,呈现数据。以下是关于在PowerPoint 2010中插入表格的详细步骤和方法: 1. **快速插入表格**: - 用户可以选择直接通过【插入】选项卡下的...
该插件旨在提供在支持它的终端上进入Vim的插入模式时更改光标的功能。 当前,仅限于iTerm,Konsole和xterm的部分支持(默认情况下,创建下划线光标而不是行)。 安装 解压缩到~/.vim (或Windows上的%USERPROFILE%\...
使用带启动的光盘或U盘,重启计算机,按F2键,进入高级模式,改变启动项,选择插入的设备启动。然后,选择破解Windows登录密码,选择密码所在的分区,输入对应的数字,按Enter键,输入要取消的密码的序号,按Enter键...
在步骤6后,你就可以修改程序"LSKEYF00"了,找到“CALL 'GET_DEVELOPER_KEY' ID 'NAME' FIELD 'ABCDEFGHIJKL'”并将光标置于其下面一行,点击STOP按钮右边的“插入”按钮,在光标处将出现*{ INSERT REQUEST IA &$&$&...
在这个步骤中,我们需要找到之前添加断点的地方,CALL 'GET_DEVELOPER_KEY' ID 'NAME' FIELD 'ABCDEFGHIJKL' ID 'CUSTID' FIELD '1234567890' ID 'KEY' FIELD DUMMY_KEY,然后将光标放在 dummy_key 后面,点击插入...
之前在工作中,需要实现Word打印功能,并且插入图片。当时采取的方式则是使用书签进行操作。首先在word内插入书签,完成后,存为模板。...此时,图片的插入就存在问题,光标无法直接移动到指定字符串。
Ctrl+Shift+D 复制光标所在整行,插入在该行之前 ctrl+shift+F 在文件夹内查找,与普通编辑器不同的地方是sublime允许添加多个文件夹进行查找 Ctrl+Shift+K 删除整行 Ctrl+Shift+L 鼠标选中多行(按下快捷键),即可...
- `i`:在光标前插入。 - `I`:在当前行首非空白字符前插入。 - `o`:在下方新开一行并进入输入模式。 - `O`:在上方新开一行并进入输入模式。 - 退出vi: - `:q`:无修改退出,如果文件有修改,vi会阻止退出...
Ctrl+Shift+D 复制光标所在整行,插入在该行之前 Ctrl+J 合并行(已选择需要合并的多行时) Ctrl+KU 改为大写 Ctrl+KL 改为小写 Ctrl+D 选词 (按住-继续选择下个相同的字符串) Ctrl+M 光标移动至括号内开始或...
为了使用 Atom-atom-gist 插件,你需要先解压缩 "atom-gist-master" 文件,然后在 Atom 中安装。安装完成后,可以通过快捷键或者在命令面板(Command Palette)中搜索 "Atom Gist" 相关命令来启动插件功能。记得在...
Ctrl+Shift+D 复制光标所在整行,插入在该行之前 Ctrl+J 合并行(已选择需要合并的多行时) Ctrl+KU 改为大写 Ctrl+KL 改为小写 Ctrl+D 选词 (按住-继续选择下个相同的字符串) Ctrl+M 光标移动至括号内开始或结束...
这款驱动特别之处在于它包含了自动插入外置鼠标时自动屏蔽触摸板的功能。这一特性对于许多用户来说非常实用,因为在使用鼠标时,他们可能不希望无意间触碰触控板导致光标移动,从而影响操作的精确性。该驱动程序的这...
- 在Vim中,`d`用于删除行,按`dd`删除当前行,按住`d`可连续删除,`x`删除当前光标处字符,`i`在当前光标前插入,`a`在当前光标后插入,`o`在当前行下方插入新行,`O`在当前行上方插入。 6. **数据库操作**: - ...
- `INSERT(n, s)`:在光标后插入长度为n的字符串s,光标位置保持不变。 - `DELETE(n)`:删除光标后的n个字符,光标位置保持不变。 - `GET(n)`:输出光标后的n个字符,光标位置保持不变。 - `PREV()`:光标前移一...
- **输入模式**: 用户可以在当前光标位置输入文本。从指令模式切换到输入模式的方法包括使用`a`、`A`、`i`、`I`、`o`、`O`等指令。 - 使用`ESC`键可以从输入模式返回到指令模式。 - **退出Vi** - 在指令模式下...