4

我试着向你解释我的“问题”。我想知道当我选择部分文本时，该文本是否被 html 标签“包装”，并在函数中删除它们。

例如这句话：

车是<strong>绿色</strong>的，船是黑色的

如果我选择“绿色”并单击一个按钮，我想验证绿色是否被包裹<strong>（因为它没关系），并且在函数中删除<strong>标签而不删除包含“绿色”的标签。

我已经尝试过这样做，但是当我删除子节点并重新创建一个子节点时，我的新节点是空的，如果我尝试直接将文本放入document.createTextNode，我的新节点会出现，但<strong>标签会保留。

// Bouton CLICK
    $('input[type=button].btn_transform').click(function(){

var selObj = window.getSelection();    
        var parent=selObj.anchorNode.parentNode;

        if (parent.nodeName=='STRONG'){       
           parent.removeChild(selObj.anchorNode);
            var theText = document.createTextNode(selObj);
            parent.appendChild(theText);             
        }
    });

我不是 DOM 操作专家。你能帮我解决这个问题吗？

非常感谢您的宝贵帮助。

4

3 回答 3

1

查看这篇文章以了解选择信息的选择方法，无论它是哪个浏览器：

选择元素中的文本（类似于用鼠标突出显示）

我认为如果您使用 SelectText 方法，那么它应该可以正常工作而不是 getSelection()

希望能帮助到你。

于 2010-03-19T17:30:21.873 回答
0

<strong>green</strong>只需将父级的 outerHTML ( ) 设置为它的 innerHTML ( )，它就可以按照您的意愿工作green，如下所示：

$('input[type=button].btn_transform').click(function(){ 

    var selObj = window.getSelection();     
    var parent=selObj.anchorNode.parentNode; 

    if (parent.nodeName=='STRONG'){        
        parent.outerHTML = parent.innerHTML;
    } 
});
于 2010-03-18T20:19:51.030 回答
0

主要使用jQuery ...

$(document).ready(function () {
        $("#btn_transform").click(function () {
            var selectedText = getSelText();
            var parentOf = $("strong:contains(" + selectedText + ")");
            $(parentOf).each(function () {
                if (this.tagName == "STRONG" || this.tagName == "strong") {
                    var theElement = $(this);
                    var itsText = $(this).text();
                    $(this).after(itsText);
                    $(this).remove();
                }
            });
        });
    });
    function getSelText(){
       // your chosen 'get selection' method...
    {

您可能遇到的唯一问题是，如果您选择出现多次的文本 - 因此该函数将匹配包含在<strong>标签之间的该文本的所有实例并将它们全部删除。

虽然我猜可能会给你一些想法。抢

于 2010-04-19T21:41:37.327 回答