Webkit，IE取消选择文本

我正在制作一个contentEditable jQuery插件。我创建了一个'工具'栏来对文本执行操作，例如使用execCommand将文本变为粗体，斜体等。问题在于，当您选择文本并单击其中一个按钮（包含onclick事件的div）时，它会取消选择您选择的文本（所有浏览器）。为了解决这个问题，我使用了：Webkit，IE取消选择文本

toolBar.onmousedown=function(){return false};

它在Firefox和Opera中运行良好。我试图使用

toolBar.onselectstart = function(){return false};

它可以防止IE中的文本选择。但是，webkit或IE都不起作用。我之前看到过使用输入按钮完成此操作，但我宁愿使用div。有任何想法吗？

来源

2010-08-26 Nick

我通过重新选择文本解决了这个问题。

在鼠标松开我捕捉选择信息：

$.getSelection = function() { 
    // ie has its own way of doing things from here on. 
    if($.browser.msie) return document.selection.createRange(); 

    if (window.getSelection) { 
     var selection = window.getSelection(); 
    } 
    else if (document.selection) { // should come last; Opera! 
     var selection = document.selection.createRange(); 
    } 

    if (selection.getRangeAt) 
     var range = selection.getRangeAt(0); 
    else { // Safari! 
     var range = document.createRange(); 
     range.setStart(selection.anchorNode, selection.anchorOffset); 
     range.setEnd(selection.focusNode, selection.focusOffset); 
    } 
    if (!range.toString().match(/[^\t\r\n ]/)) return false; 

    var ret = {}; 

    // start end length text 

    ret.startContainer = range.startContainer; 
    ret.start = range.startOffset; 
    ret.endContainer = range.endContainer; 
    ret.end  = range.endOffset; 
    ret.length = ret.end - ret.start; 
    ret.collapsed = range.collapsed; 

    return ret; 
};

这是什么地方您选择的存储。

我然后要么重新选择文本，如果浏览器是DOM范围W3C标准（即所有，但IE）和执行的execCommand：

function handleReselection() { 
    if($.browser.msie) { 
     return this.selection; 
    } 
    else { 
     setSelection(this.selection); 
     return document 
    } 
} 

function setSelection(selection) { 
    var sel = window.getSelection(); 
    sel.removeAllRanges(); 
    var range = document.createRange(); 
    range.setStart(selection.startContainer, selection.start); 
    range.setEnd(selection.endContainer, selection.end); 
    sel.addRange(range); 
} 

handleReselection().execCommand('bold', false, null);

来源

2010-08-27 22:15:34 Nick

一个简单的选择是使用<按钮>标签工具栏。这样它不会丢失文本选择。

来源

2011-06-03 17:27:41 dhundsness

Webkit，IE取消选择文本

回答

相关问题