3

我想选择一个图像并将一个类名添加到选择中。使用window.getSelection.


function addClassName() {
     var sel = window.getSelection();
     //what goes here???
}


<input type='button' onclick='addClassName();' value='addClassName'/>
4

4 回答 4

6

要将类添加到选择中，您需要将其包装起来，<span>否则它将不起作用。这是解决方案。

    function addClassToSelection(){
    var sel = window.getSelection ? window.getSelection() : document.selection.createRange(); // FF : IE
    if(sel.getRangeAt){ // thats for FF
    var range = sel.getRangeAt(0);
    var newNode = document.createElement("span");
    newNode.setAttribute('class', 'someclass');
    range.surroundContents(newNode);
    } else { //and thats for IE7
    sel.pasteHTML('<span class="someclass">'+sel.htmlText+'</span>');

    }
    }

这应该会引导您朝着正确的方向前进。按照您认为合适的方式对其进行修改。

在http://jsfiddle.net/wP8w9/2/检查工作示例

于 2011-03-07T19:38:34.693 回答
1

$(sel).find('img').addClass('myClass');

这将获取所选内容，将其转换为 jQuery 对象，找到图像并为其添加一个类。

我没有测试过这个。

于 2011-03-07T18:23:30.267 回答
0

如果你想使用 javascript，你可以这样做：

function addClassName() {
     $('img').addClass('newClass') // adds the class 'newClass' to all image objects
}


<input type='button' onclick='addClassName();' value='addClassName'/>

您也可以在该函数中使用除“img”之外的任何选择器

于 2011-03-07T18:14:47.320 回答
0 
var sel= window.getSelection().getRangeAt(0);

$(sel).addClass("someClass");

window.getSelection()将为您提供选择，但不是当前（或突出显示）的选择。您需要为此使用选择的 getRangeAt 方法

于 2011-03-07T18:51:43.410 回答