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

时间:2017-02-07 18:10:45

标签: javascript jquery double double-click textselection

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

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

我尝试使用此代码

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

2 个答案:

答案 0 :(得分: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();
    }
}

答案 1 :(得分:0)

这是我的前叉: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);
  }
});