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() 方法很重要，因此您没有一堆相邻的文本节点。它使所有文本节点再次聚合到一个文本节点中。

对于您的确切问题，您可以遍历所有节点，然后执行上述代码。

于 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 回答