Question

我正在使用以下代码通过更改其字体来编辑contenteditable div中的文本。当点击作为风格化下拉菜单的div时，选择将在chrome中消失。它在firefox，opera甚至在IE中工作正常！

Rangy没有找到任何选定的文字来处理。我想知道为什么！

注意：使用“鼠标悬停”代替“点击”时效果正常

DropDown.prototype = {
    initEvents : function() {
        var obj = this;

        obj.dt.on('click', function(event){
            $(this).toggleClass('active');
            if (savedSel) {
                rangy.removeMarkers(savedSel);
            }
            savedSel = rangy.saveSelection();
            savedSelActiveElement = document.activeElement;
            return false;
        });

    }
}

Answer 1

一种解决方法是使用mousedown事件而不是click事件，并阻止默认行为。

obj.dt.mousedown(function(event){
    event.preventDefault();
    $(this).toggleClass('active');
    if (savedSel) {
        rangy.removeMarkers(savedSel);
    }
    savedSel = rangy.saveSelection();
    savedSelActiveElement = document.activeElement;
    return false;
});

演示：http://jsfiddle.net/NJuMK/1/

Answer 2

您应该在点击发生之前保存选择数据。例如，将鼠标保存在鼠标上，并在用户点击时使用它。

单击div时为什么选择会消失？

2 个答案: