如何 Select 按范围从当前单词到段落中该 Sentence(.) 结尾的文本

Question

我需要实现select按范围点击从当前单词到段落中该句子结尾的文本离子。

例如：

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the...

是一个段落。当我点击 dummy 时，selection 将从虚拟到工业完成。下面的代码使我能够 select 单击一次完整的段落。

<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>

Answer 1

这个 fiddle 几乎可以满足您的需求。可能需要稍微调整一下，但它会从单击的单词中选择带有句点的第一个单词。处理 space 可能会很棘手，就像现在一样，它也会选择句点后的 space。

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");
  });

如何 Select 按范围从当前单词到段落中该 Sentence(.) 结尾的文本

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

javascript

jquery

click

textselection