JS to get selected text as well as text before and after.

getSelection.js

// Also see fiddle at:
//

function getUnselectedText(containerEl) {
  var sel,
    range,
    tempRange,
    before = "",
    after = "",
    selected = "";
  if (typeof window.getSelection != "undefined") {
    sel = window.getSelection();
    selected = sel.toString();
    if (sel.rangeCount) {
      range = sel.getRangeAt(0);
    } else {
      range = document.createRange();
      range.collapse(true);
    }
    tempRange = document.createRange();
    tempRange.selectNodeContents(containerEl);
    tempRange.setEnd(range.startContainer, range.startOffset);
    before = tempRange.toString();

    tempRange.selectNodeContents(containerEl);
    tempRange.setStart(range.endContainer, range.endOffset);
    after = tempRange.toString();

    tempRange.detach();
  } else if ((sel = document.selection) && sel.type != "Control") {
    selected = document.selection.createRange().text;
    range = sel.createRange();
    tempRange = document.body.createTextRange();
    tempRange.moveToElementText(containerEl);
    tempRange.setEndPoint("EndToStart", range);
    before = tempRange.text;

    tempRange.moveToElementText(containerEl);
    tempRange.setEndPoint("StartToEnd", range);
    after = tempRange.text;
  }
  return {
    selected: selected,
    before: before,
    after: after,
  };
}

function reportUnselectedText(node) {
  var unselected = getUnselectedText(node);
  console.log(
    "Before: " +
      unselected.before +
      "\nSelected: " +
      unselected.selected +
      "\nAfter: " +
      unselected.after
  );
}

function doSomethingWithSelectedText() {
  var selected = window.getSelection();
  reportUnselectedText(selected.anchorNode);
}

document.onmouseup = doSomethingWithSelectedText;
document.onkeyup = doSomethingWithSelectedText;