标签: rangy

我试图用chrome的'纯文本'的行为创建一个contenteditable div.因此,用户只能输入纯文本,而在复制富文本时,它会被粘贴为纯文本.在我的脚本中,@ -mentions转换为按钮并使用Rangy.js添加

在普通的contenteditable div中,可以粘贴富文本,我需要将其转换为普通文本.唯一的问题是检测粘贴的内容,然后将其转换为文本并将其插入正确的位置,并在恢复胡萝卜位置后.在更多行上选择更多文本时更难.

我是否认为很难,是否有更简单的解决方案？或者任何人都可以推荐最轻量级的编辑器？

谢谢!

我有以下代码片段来将插入符号设置为给定的索引 index

var el = $("#subjectMessage"), index = 9 ;
var range = rangy.createRange();
range.setStart(el[0].childNodes[0], index);
range.collapse(true);
var sel = rangy.getSelection();
sel.setSingleRange(range);

当我将输入元素添加到contentEditable时会出现问题div,我不能再将插入符号设置在所需的位置.

我想将这些输入视为div中的一个位置(就好像它们只是一个字符一样).

除此之外,我还需要类似的代码这CONTENTEDITABLE内更换选择div用我自己的一些文字,我真的不熟悉(所有),与四肢修长,以了解如何使这项工作？

非常欢迎所有帮助!

这是你可以玩的小提琴:

http://jsfiddle.net/ee93P/

我正在使用Rangy中可用的荧光笔模块，它在为所选文本创建突出显示时效果很好。

就html的更改而言，所选文本将由span标记代替，例如以下所示：

the selected text is <span class="highlight">replaced by a span tag</span> like the

我想做的是在创建span元素后获得对它的引用，以便我可以对其进行其他处理。如何才能做到这一点？

请注意，在其他地方可能存在其他带有或没有高亮标记的跨度，因此无法使用这些跨度来找到它。

我必须为所选文本创建突出显示的代码的重要部分是：

var highlighter = null;
var cssApplier = null;

rangy.init();
cssApplier = rangy.createCssClassApplier("highlight", { normalize: true });
highlighter = rangy.createHighlighter(document, "TextRange");
highlighter.addClassApplier(cssApplier);

var selection = rangy.getSelection();
highlighter.highlightSelection("highlight", selection);

我有几个元素在一个满足的范围内div.如何将键盘插入符号放在由id标识的特定元素的末尾,然后将其移动到div使用Rangy的末尾？

在此先感谢,任何帮助表示赞赏.

我正在尝试使用最新版本的"rangy"jQuery插件(1.2 beta)来将插入符号设置为具有特定偏移量的可信DIV.

但是,它在Firefox中响应一个奇怪的错误:安全错误"代码:"1000

这是违规代码:

var el = $("#editablediv"), index = 11;
var range = rangy.createRange();
range.setStart(el, index);
var sel = rangy.getSelection();
sel.setSingleRange(range);

调用setStart函数时代码失败.

有人能举一个正确使用rangy的例子吗？

我有一个常插入DOM的常规文本节点.

我想选择它(就像用户用鼠标选择它一样),使用Javascript或Rangy.

我有以下(我觉得很难看)代码:

        // insert as regular text node
        var txt = document.createTextNode($mySpan.text());
        $myHeading.get(0).insertBefore(txt, $mySpan.get(0));

        // select again
        var sel = rangy.getSelection();
        sel.removeAllRanges()

        var range = rangy.createRange();
        range.selectNode(txt);

我很乐意为此提供帮助.我不知道如何实现它,并且goggling不起作用.我能想到的唯一方法是在文本之间插入2个元素,然后选择它,然后删除元素,但我想知道是否有更优雅的方式.

谢谢,任何帮助表示赞赏.

我正在尝试bootstrap-wysihtml5-rails,我正在使用twitter bootstrap 2

但是当我在图像中得到这个结果时,错误:

Discontiguous selection is not supported.

我试着window['rangy'].initialized = false;这样:

<script type="text/javascript">
    $(document).ready(function(){


        window['rangy'].initialized = false;

        $('.wysihtml5').each(function(i, elem) {
            $(elem).wysihtml5();
        });
    })
</script>

但我仍然得到同样的错误,我可以忍受它,但它似乎打破了编辑器的按钮,如图像,任何人都可以帮助？

我有一个简单的可编辑内容，其中包含带有标签的文本...当插入标签时，单词将替换为其中的跨度...

<div contenteditable=true>
      text text text <span class="tag">tag</span> 
</div>

这就是结果（当用户按空格键时，标签被包含标签文本的跨度替换；这在键入时发生）

然后，我需要将光标放在可编辑内容的末尾（跨度之外），以便让用户继续输入...

我已经能够将光标移动到最后，但只能移动到跨度内...

我用兰吉。

就像这样rangy library说，我们需要选择text使其突出显示并删除突出显示。

为了突出显示它包括span tag。

要删除突出显示的文本，我想单击span tag而不是选择该文本。

这是library用于删除突出显示的方法：

 unhighlightSelection: function(selection) {
                selection = selection || api.getSelection();
                console.log(selection.getAllRanges())
                var intersectingHighlights = this.getIntersectingHighlights( selection.getAllRanges() );
                this.removeHighlights(intersectingHighlights);
                selection.removeAllRanges();
                return intersectingHighlights;
            }

在这里，selection变量用api.getSelection()代替local selection variable。

我认为足以让所有人了解我的问题。

如果您愿意，我可以提供更多描述。

我可以做一些事情，以占领了selection variable一样api.getSelection()不使用它？

或我为实现这一目标需要做什么？

任何建议都将令我感激。

谢谢

我有一个内容可编辑的 div。在此我插入一个<pre>some code</pre>标签。此标签旨在允许用户输入格式化代码，类似于 SO。

我遇到的问题是 FF 正在插入<br>标签来代替 \r\n，这在正常的 Html 中是正确的，但在 pre 我实际上想要 \r\n。

我尝试将委托附加到父 contenteditable。但这不会为嵌套的 dom 元素触发。所以

$('#contenteditablediv').delegate('pre', 'keyup', function() { ... });

不火。我还尝试处理父 div 上的正常 keyup，并用 \r\n 替换 pre 标签中的所有 brs。但这会弄乱插入符号并且很笨重。

有没有首选的方法来做到这一点？

我可能不得不求助于剥离它们的服务器端，但我宁愿不这样做。

非常感谢

我有一个以下问题,并寻找提示如何使用rangy或本机范围对象.我有div元素,其中包含以下文本:"这是示例文本." 从服务我收到这个例子json响应.[{start:0,end:10},{start:2,end:8}]我想添加标记0到10和2到8的文本的跨度.所以必须添加第二个跨度 - 从2到8与已增加的跨度的偏差.

最好的祝福.