Question

我有这个HTML

<div>This text is <strong>really</strong> awesome!</div>

我想在<span>点击部分文字内。因此，如果您点击此文字部分，您应该

<div><span>This text is </span><strong>really</strong> awesome!</div>

与div

的任何原子部分相同

我正在尝试制作$('div').click();事件但我无法找到如何仅检测点击的部分（如果它没有包裹在某物内部）（<strong>really</strong>部分可以正常但不能部分之前和之后）

Answer 1

您可能希望查看.contents()方法。这将为您提供文本节点以及包装节点，因此您可以将它们包装起来。要从jQuery文档中调整示例：

$(".container")
    .contents()
    .filter(function() {
        // get only the text nodes
        return this.nodeType === 3;
    })
    .wrap( "<span></span>" );

听起来你想在点击之后包装内容，我觉得这可能很难。如果可能的话，最好在用户点击之前包装内容，然后将样式应用于他们点击的span - 这更为简单。如果您使用上面的代码进行换行，则可以应用像

这样的处理程序
$(".container").on('click', 'span', function() { $(this).addClass('clicked'); });

jQuery包装没有容器的文本

1 个答案: