Question

我想在jquery中使用带有span标签的多个标签包围选定的文本和图像或文本。我怎么能实现这一点，我见过许多例子，如下面的jsfiddle代码。所有示例仅使用文本进行，但现在希望用span标记包围文本和图像。提前致谢

$(document).ready(function(){
$('.format').click(function(){
    var highlight = window.getSelection(),  
    spn = '<span class="highlight">' + highlight + '</span>',
    text = $('.conttext').text(),
    range = highlight.getRangeAt(0),
    startText = text.substring(0, range.startOffset), 
    endText = text.substring(range.endOffset, text.length);

    $('.conttext').html(startText + spn + endText);
});
});

JSFiddle

Answer 1

更改您的代码以使用范围的surroundContents method。

$('.format').click(function () {
    var highlight = window.getSelection(),
        spn = $('<span class="highlight" />')[0],
        range = highlight.getRangeAt(0);

    range.surroundContents(spn);
});

http://jsfiddle.net/gaby/BGKSN/181的演示使用http://jsfiddle.net/gaby/BGKSN/182/

上的图片进行演示

jquery环绕选定的文本和带有span标记的图像

1 个答案: