3

以前の質問で、誰かが私を "rangy" http://code.google.com/p/rangy/に置きました。よくわからなくても面白い。私はJavaScriptの人ではありません。ただし、1を除いて、必要なほとんどのことを行うことができました。コンセプトは非常に基本的なRTEで、太字、斜体などです。それを管理し、リンクを作成しました-それも行いました。 JSの男を連れて2分で何時間もかかりました-イライラしますが、少し学んでいると思います-非常にゆっくりです。とにかく、rangy を使用して、次のような href リンクを作成できます (悪いコードを許してください)。

$('#linkbut').live('click',function(){
        var sel = rangy.getSelection();     
        var range = sel.getRangeAt(0); 
        range.splitBoundaries(); 
        var textNodes = range.getNodes([3]); 
            for (var i = 0, len = textNodes.length; i < len; ++i) { 
            var newLink = document.createElement('a');
            newLink.setAttribute('href','test.html');
            var linkText = document.createTextNode(sel);
            var parent = textNodes[i].parentNode;
            parent.insertBefore(newLink,textNodes[i]); 
            newLink.appendChild(linkText);
            range.deleteContents();
            }
    });

#linkbutは単純な HTML ボタンであり、上記の実際の href (test.html) は入力フィールドの値から取得され、「ハードコード」されません。しかし、リンクを削除したい場合、リンクを「削除」することはできません。

詳細な説明: リンクが作成されたら、それを削除したいかもしれないので、上記のコードの「逆」を試しました - 明らかに良くないので、「ここまで」取得しました:

$('#deletelink').live('click',function(){
                var sel = rangy.getSelection();     
                var range = sel.getRangeAt(0); 
                range.splitBoundaries(); 
                var textNodes = range.getNodes([3]); 
                var txt = sel.toString();
                range.deleteContents();
                var replaceText = document.createTextNode(txt);
                sel.appendChild(replaceText);

            });

私が本当にやりたいこと (不可能かもしれません) は、上記のノードから任意のタグ要素を削除する「一般的な」関数を用意することです。

  1. 範囲を取得します -sel = rangy.getSelection();
  2. 「sel」を文字列変数に変換しますvar txt = sel.toString();
  3. コンテンツを削除します - 次にa要素 を含めますrange.deleteContents();
  4. 削除されたものを「テキスト」バージョンに置き換えます var replaceText = document.createTextNode(txt); sel.appendChild(replaceText);

「これまでのところ」コンテンツが削除されていますが、「新しいテキストの置換」が機能しません。

すべてが明確であることを願っています-それは私にはわかりません;）

4

2 に答える 2

1

古い質問は知っていますが、同じ問題があり、ここで実行可能な解決策を見つけました。

var el = document.getElementsByTagName('span')[0]; // Get the element in question
var pa = el.parentNode;

while(el.firstChild) {
    pa.insertBefore(el.firstChild, el);
}

pa.removeChild(el);
pa.normalize();

編集:多数の隣接するテキスト ノードがないように、normalize() メソッドは重要です。これにより、すべてのテキスト ノードが再び 1 つのテキスト ノードに集約されます。

正確な質問については、すべてのノードを反復処理してから、上記のコードを実行できます。

于 2012-08-16T20:15:35.707 に答える
0

おそらくjQueryでネストされた選択を行う方法を調べる必要があり、NeXXeuSが言ったように、選択したメソッドで .html() を介してコンテンツを削除することを検討する必要があります。

あなたが持っている場合：

<div id="mydiv"></div>

そして、次のように実行します: `

$('#mydiv').append('<a href="test.html">Test Link</a>');

html は次のようになります。

<div id="mydiv"><a href="test.html">Test Link</a></div>

これでリンクを選択できます：

$('#mydiv a');

次のようにして削除できます。

$('#mydiv').html('');
于 2011-03-20T15:23:35.647 に答える