document.execCommand и выделение
Общие функции
(function(){ var cache = {}; gid = function(id){ return cache[id] ? cache[id] : cache[id] = document.getElementById(id); }; })(); function saveSelection() { var sel = window.getSelection(); return sel.rangeCount ? sel.getRangeAt(0) : null; } function restoreSelection(range) { var sel = window.getSelection(); sel.removeAllRanges(); sel.addRange(range); } Сам редактор addEventListener('load', function() { var html = gid('htmlContent'), range = null; html.addEventListener('mouseup', function() { range = saveSelection(); }); function applyFormat(format, value) { if (range) { console.log(range); restoreSelection(range); document.execCommand(format, false, value); console.log(range); } } gid('iconBold').addEventListener('click', function() { applyFormat('bold'); }); gid('iconItalic').addEventListener('click', function() { applyFormat('italic'); }); gid('iconUnderline').addEventListener('click', function() { applyFormat('underline'); }); }); После выполнения document.execCommand изменяется Range // до: Range {commonAncestorContainer: text, collapsed: false, endOffset: 16, endContainer: text, startOffset: 13…} collapsed: true commonAncestorContainer: #text endContainer: #text endOffset: 0 startContainer: #text startOffset: 0 __proto__: Range // после: Range {commonAncestorContainer: text, collapsed: true, endOffset: 0, endContainer: text, startOffset: 0…} collapsed: true commonAncestorContainer: #text endContainer: #text endOffset: 0 startContainer: #text startOffset: 0 __proto__: Range как предотвратить? |
пробовал клонировать все равно сворачивается
function applyFormat(format, value) { if (range) { var copy = range.cloneRange(); console.log(range); restoreSelection(range); document.execCommand(format, false, value); range = copy; console.log(range); } } |
Часовой пояс GMT +3, время: 09:51. |