Javascript - 防止在三次点击时选择全文，并仅选择单个单词

Question

当我们双击单个单词然后浏览器选择该单词时，当我们点击单个单词然后浏览器选择整个单行或整个段落。

在这里，我想防止在三次点击中选择所有单词并更改为仅选择单个单词

我试过这个代码

function clearSelection() {
    if(document.selection && document.selection.empty) {
        document.selection.empty();
    } else if(window.getSelection) {
        var sel = window.getSelection();
        sel.removeAllRanges();
    }
}

Answer 1

这对你有用吗？jsfiddle

我编辑你的小提琴。

document.querySelector('div').addEventListener('click', function (evt) {
    var o = this,
        ot = this.textContent;
    if (evt.detail >= 3) {
        clearSelection();
    }
});

function clearSelection() {
    if(document.selection && document.selection.empty) {
        document.selection.empty();
    } else if(window.getSelection) {
        var sel = window.getSelection();
        sel.removeAllRanges();
    }
}

Answer 2

这是我的叉子：http://jsfiddle.net/kr2t0bpw/1/

它会在第二次单击时捕获所选单词并保存偏移量。在第三次单击时，它将清除选择并创建一个具有先前保存的偏移的新选择。

var throttle = false;
var sel = window.getSelection();
var selStart = 0;
var selEnd = 0;

document.querySelector('div').addEventListener('click', function (evt) {    
    if (!throttle && evt.detail === 2) {
      selStart = sel.anchorOffset;
      selEnd = sel.focusOffset;
    }

    if (!throttle && evt.detail === 3) {
    var node = this.firstChild;
    sel.removeAllRanges();
    throttle = true;

    var range = document.createRange();
    range.setStart(node, selStart);
    range.setEnd(node, selEnd)

    sel.removeAllRanges();
    sel.addRange(range);
  }
});