如何禁用选择div中的一些文本？

Question

假设我有一个带标记的文本,例如:

我想禁用选择这样选择的开始或结束不在标记中.因此,所有这些选择都应该是可能的:

另一方面,应禁用这些选择:

到目前为止,我只尝试使用一些简单的CSS,

mark {
   -khtml-user-select: all;
   -webkit-user-select: all;
   -o-user-select: all;
   user-select: all;
}

This is <mark>marked text</mark>. I want to disable selecting only part of <mark>marked text</mark>.

jsfiddle链接

有没有办法做到这一点？任何答案将不胜感激!

---

我实现了我想做的事情,所以我在这里分享.

function checkSelection () {
  var sel = window.getSelection();
  var marks = document.getElementsByTagName('mark');
  for(var i = 1; i < sel.rangeCount; i++) {
    sel.removeRange(sel.getRangeAt(i));
  }
  var range = sel.getRangeAt(0);
  var startnode = range.startContainer;
  var endnode = range.endContainer;
  for (var i = 0; i < marks.length; i++) {
  	if (marks[i].contains(startnode)) {
      range.setStartBefore(startnode);
    }
  	if (marks[i].contains(endnode)) {
      range.setEndAfter(endnode);
    }
  }
}

document.addEventListener('mouseup', checkSelection)
document.addEventListener('touchend', checkSelection)

This is <mark>marked text</mark>. I want to disable selecting only part of <mark>marked text</mark>.

jsfiddle链接