3

我正在我的一个应用程序中构建一个简单的博客式功能，并使用 HTML5 contenteditable 属性，因为它很干净。但是，我现在需要做的是，当用户突出显示 contenteditable div 中的某些文本时，需要在其上方出现一个弹出窗口。现在我有一个函数可以获取选定的文本，该文本绑定到 DIV 的 mouseup()。但是，当我单击 contenteditable 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 时，如何防止调用被触发，并且只有当他们突出显示某些文本时？

4

2 回答 2

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


  } 
         });
于 2013-08-31T02:20:22.383 回答
0

将其转换为字符串 ( .toString())，trim()在所选字符串为空的情况下使用，并在mouseup事件中检查所选字符串的长度。

 $("#content-create-partial").bind("mouseup", function(){
        var text = getSelected().toString().trim();
        if(text.length>0) {
            console.log(text);
        }
        else{
            console.log("Nothing selected?");
        };
    });
于 2018-10-05T15:25:54.317 回答