Question

我在div selectable中有一些文字，我希望允许用户通过使用光标选择文字来删除文字。

它工作正常，但是如果你点击文本，一切都会被删除。如果单击并拖动以选择，则可以正常工作。

我可以做些什么来使其正确使用我的文字。如果用户单击文本，则不应删除所有内容。

jsFiddle进行测试。

jQuery的：

    if (window.getSelection().toString() != "") {
        selectedText = window.getSelection().toString()
        var text1 = $(".selectable").text().split("")
        pointStart = window.getSelection().anchorOffset
        pointEnd = window.getSelection().focusOffset

        if (pointEnd < pointStart) {
            pointStart = pointEnd
        }
        text1.splice(pointStart, selectedText.length);
        text1 = text1.join("")
    } else {
        selectedText = $(".selectable").text()
        var text1 = ""
    }
$(".selectable").text(text1)

示例HTML：

<div class="selectable">
   Hello world what is 進撃の巨人 reality test test... test.
</div>

编辑：潜在的解决方案：

if (window.getSelection().toString() == "") {
    return false;
    }

Answer 1

您的错误在于else部分。如果用户没有选择任何文本，只需单击文本，就会执行else代码块。

在该块中，您可以指定var text1 = "";

稍后您将text1作为$(".selectable")元素的文字内容。

只需将该行更改为：

var text1 = selectedText;

查看更新后的fiddle

我还建议您在mouseup处理程序的顶部只声明var text1一次，并将作业从var text1 = "value"更改为text1 = "value"

请参阅：var hoisting

删除所选/突出显示的文本

1 个答案: