插件 jQuery.Rangy Inputs 中文 API 文档

🌙
手机阅读
本文目录结构

插件 jQuery.Rangy Inputs 中文 API 文档 https://github.com/timdown/rangyinputs

一个小的 jQuery 插件,用于 textareas 和文本输入中的选择和插入符号操作。

https://rawgit.com/timdown/rangyinputs/master/demo/demo.html

想象一下简单的 textarea,例如:

<textarea id="test">Foo bar</textarea>

您可以使用获取用户的选择

var sel = $("#test").getSelection();
console.log(sel.start + ", " + sel.end);

要选择单词“bar”:

$("#test").setSelection(4, 7);

其他方法如下。示例代码指的是上面的示例 textarea。

API

Rangy Inputs 为包装单个文本输入或 textarea 的所有 jQuery 对象提供以下扩展。

焦点

在 Internet Explorer 中,元素必须具有以下任何方法的焦点,这可以通过在调用 focus() 方法之前调用其元素(或其 jQuery 对象)的方法来实现。

getSelection() 返回表示文本输入或 textarea 元素中的用户选择的对象。

返回的对象具有以下属性:

start:选择的起始位置的字符索引 end:选择结束位置的字符索引 length:选择的字符数 text:所选文本 例

$("#test").focus();
var sel = $("#test").getSelection();
alert(sel.start + ", " + sel.end);

setSelection(Number start[, Number end]) 选择指定的开始和结束字符索引之间的文本输入或 textarea 元素中的文本。如果 end 省略,则删除选择并将插入符号放在字符索引处 start。

返回对元素的原始 jQuery 对象的引用。

例子

要选择单词“bar”:

$("#test").setSelection(4, 7);

将插入符号放在“bar”之前:

$("#test").setSelection(4);

collapseSelection(Boolean toStart) 如果 toStart 为 true ,则在当前选择的开始处将选择折叠到插入点(插入符号),否则将当前选择的结束折叠。

返回对元素的原始 jQuery 对象的引用。

要将选择折叠到开头:

$("#test").collapseSelection(true); deleteText(Number start, Number end, Boolean moveSelection) 删除指定的开始和结束字符索引之间的文本输入或 textarea 元素内的文本,并可选择将插入符号放在已删除文本的位置(如果 moveSelection 是)true。

返回对元素的原始 jQuery 对象的引用。

要从示例中删除单词“foo”并将插入符号放在“foo”所在的位置:

$("#test").deleteText(0, 3, true);

deleteSelectedText() 删除文本输入或 textarea 元素中当前选定的文本,并将插入符号放在已删除文本的位置。

返回对元素的原始 jQuery 对象的引用。

$("#test").deleteSelectedText();

extractSelectedText() 删除文本输入或 textarea 元素中当前选定的文本,将插入符号放在已删除文本所在的位置,并返回已删除的文本。

var extracted = $("#test").extractSelectedText();
console.log(extracted);

insertText(String text, Number pos[, String selectionBehaviour]) 将指定的文本插入文本输入或 textarea 元素中的指定字符位置,并根据值的值有选择地更新选择 selectionBehaviour。可能的值是:

“选择”:选择插入的文本 “collapseToStart”:将所选内容折叠到插入文本开头的插入符号 “collapseToEnd”:将所选内容折叠到插入文本末尾的插入符号 如果没有提供任何值 selectionBehaviour,则选择不会改变并留在浏览器的左侧(当 textarea 的值改变时,将插入符号放在开头并不罕见)。

返回对元素的原始 jQuery 对象的引用。

在“foo”和“bar”之间插入“baz”一词,并在“baz”之后立即放置插入符号:

$("#test").insertText(" baz", 3, "collapseToEnd");

replaceSelectedText(String text[, String selectionBehaviour]) 使用指定的文本替换 text input 或 textarea 元素中当前选定的文本,并根据值选择更新选择 selectionBehaviour。可能的值是:

“选择”:选择插入的文本 “collapseToStart”:将所选内容折叠到插入文本开头的插入符号 “collapseToEnd”:将所选内容折叠到插入文本末尾的插入符号 如果没有提供值 selectionBehaviour,则假定为“collapseToEnd”。

返回对元素的原始 jQuery 对象的引用。

例子

要用“baz”替换选择(如果没有选择文本,则在插入位置插入“baz”):

$("#test").replaceSelectedText("baz");

要做同样的事情,但之后选择“baz”:

$("#test").replaceSelectedText("baz", "select");

surroundSelectedText(String textBefore, String textAfter[, String selectionBehaviour]) 使用指定的文本块覆盖文本输入或 textarea 元素中当前选定的文本,并根据值的值选择性地更新选择 selectionBehaviour。可能的值是:

“选择”:选择被包围的文本 “collapseToStart”:将选区折叠到包围文本开头的插入符号 “collapseToEnd”:将选区折叠到包围文本末尾的插入符号 如果没有提供值 selectionBehaviour,则假定为“select”。

返回对元素的原始 jQuery 对象的引用。

要使用 HTML 标记包围所选内容:

$("#test").surroundSelectedText("<b>", "</b>");

AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili

关注我: Github / 知乎

目前重心已经放在研究区块链上面了

我叫朱安邦,阿西河的站长

目前在杭州从事区块链周边的开发工作,机械专业,以前从事平面设计工作。

2014年底脱产在老家自学6个月的前端技术,自学期间几乎从未出过家门,最终找到了满意的前端工作。更多>