13

所以我在我的 Rails 应用程序中有一个 contenteditable div，并且需要能够在突出显示时在文本上方显示一个小弹出窗口。目前我有有效的代码，它在警报中显示突出显示的文本。但是，该函数在 mouseup 上执行，因此当您单击 div 开始键入或突出显示时，它会引发一个空警报。

这是我的代码：

function getSelected() {
            if (window.getSelection) {
                return window.getSelection();
            }
            else if (document.getSelection) {
                return document.getSelection();
            }
            else {
                var selection = document.selection && document.selection.createRange();
                if (selection.text) {
                    return selection.text;
                }
                return false;
            }
            return false;
        };
$("#content-create-partial").bind("mouseup", function(){
                var text = getSelected();
                if(text) {
                    console.log(text);
                }
                else{
                    console.log("Nothing selected?");
                };
            });

当用户单击 contentEditable div 时，如何防止 jQuery 执行该函数？我只希望它在突出显示实际文本时执行。

4

6 回答 6

5

您可以比较window.getSelection().anchorOffset并window.getSelection().extentOffset查看它们是否相等。如果是，那么这只是一次正常的点击。

于 2016-08-06T13:10:12.960 回答
3

如果未选择任何内容，则以下内容将返回 true。

灵感来自@Tarun Dugar。但不适用于所有浏览器。以下工作。

window.getSelection().focusOffset == window.getSelection().anchorOffset;
于 2017-06-02T12:32:45.720 回答
2

尝试这个

window.getSelection().anchorNode.data.substring( window.getSelection().anchorOffset,window.getSelection().extentOffset )

在这里尝试工作示例。

于 2018-07-26T07:42:23.850 回答
1

您可以简单地检查该Selection.toString()方法是否返回一个空字符串

if(window.getSelection().toString()){
    // do something
}
于 2018-05-17T22:29:52.877 回答
0

当用户开始选择时会触发“selectstart”事件。没有选择结束事件，但您可以在“selectstart”事件触发后监听 mouseup 事件以确保选择已经发生。

编辑：

检查 - HTML 内容可编辑 div：选择文本事件

于 2014-06-12T05:45:39.167 回答
-2

只需检查选择是否为空：if ($.trim( text) != '') ...

于 2013-08-26T04:55:46.530 回答