0

content-editable 要素に挿入または削除操作を適用したいと考えています。例：

element = $('.content')
op = {insert: 'This works', pos:32}

applyOperation(element, op)

変換します:

<div class='content'><i>anything</i> something else <i>anything else</i></div>

の中へ：

<div class='content'><i>anything</i> something else This works<i>anything else</i></div>

制約: 完全なコンテンツの置き換えは避けたい。

注: 今のところ、HTML の有効性と選択/キャレットの位置を気にしないでください。

4

2 に答える 2

1

私はあなたのためにこの関数を書きます：

/**
 * @author Georgi Naumov
 * gonaumov@gmail.com
 * http://georgi-naumov.blogspot.com/
 **/
function applyOperation(element, op) {
   if(typeof op['insert'] != 'undefined' && typeof op['pos'] != 'undefined') {
       var resultHtml = element.html().replace(new RegExp("((?:[^\s]|[\s]+){" + op['pos'] + "})"), "$1" + op['insert']);
       element.html(resultHtml);
       return element;
   }
}

ここでjsfiddleが動作しています： http://jsfiddle.net/zono/qY5yg/

于 2013-08-22T11:09:28.523 に答える
0

私は多くの研究を行ってきました。答えは、非破壊的な方法で達成するのはかなり難しいということです。

ただし、James Padolsey はこの問題について2 つの優れた記事を書き、2 つ目の記事は答えをもたらします。そして、誰もが使用できるライブラリを作成しました。

解決策には、( を介して) テキスト ノードの分割とマージを行うことが含まれますnormalize()。本当に良いもの。

于 2013-08-23T12:45:54.733 に答える