如何按从当前单词到段落中该句子(.）结尾的范围选择文本

How to Select text by range from the current word to end of that Sentence(.) in a paragraph

本文关键字：结尾 范围 文本 选择 句子 何按 单词 段落中      更新时间：2023-09-26

>我需要在单击从当前单词到段落中该句子末尾时按范围选择文本。

例如：

Lorem Ipsum只是印刷和排版行业的虚拟文本。Lorem Ipsum一直是...

是一个段落。当我点击虚拟人时，将从虚拟人到行业进行选择。下面的代码使我能够通过单击选择整个段落。

<html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <style type="text/css">
       p {
       font-family: monospace;
       font-size: 1.5em;
       }    
    </style>
   </head>
   <body>
      <div id="autoselect">
         <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
    when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, 
    remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing 
    software like Aldus PageMaker including versions of Lorem Ipsum.</p>
     </div>
 <script type="text/javascript">
  function SelectText(element) {
    var doc = document,
        text = doc.getElementById(element),
        range,
        selection;
    if (doc.body.createTextRange) {
        range = document.body.createTextRange();
        range.moveToElementText(text);
        range.select();
    } else if (window.getSelection) {
        selection = window.getSelection();        
        range = document.createRange();
        range.selectNodeContents(text);
        selection.removeAllRanges();
        selection.addRange(range);
    }
}
$(function() {
    $('p').click(function () {
        SelectText('autoselect');
    });
}); 
</script>
</body>

这个小提琴几乎可以做你想要的。可能需要稍作调整，但它会从单击的单词选择第一个带有句点的单词。处理空格可能很棘手，就像现在一样，它也会在句点之后选择空格。

https://jsfiddle.net/flatulentdog/86tfuff0/

  var words = $("p:first").text().split(" ");
  var text = words.join("</span> <span>");
  $("p:first").html("<span>" + text + "</span>");
  $("span").click(function () {
    $(this).css("background-color","yellow");
    var next = $(this).next();
    while(next.text().indexOf('.') === -1) {
        next.css("background-color","yellow");
        next = next.next();
    }
    next.css("background-color","yellow");
  });
相关文章：