限制 contenteditable div 中存储在数据库中的字符数

Question

这是我当前的系统：

我有一个 contenteditable div，用户可以在其中插入文本、图像、链接等。
div 中的 HTML 被插入到数据库中。
如果 div 的数据超过数据库中字段的长度，则数据将被截断。

我想对 contenteditable div 添加限制，这样用户输入的数据将永远不会被截断，但是我不知道如何对 div 实施限制，因为实际的 HTML 被计算在字段 space 中，而不仅仅是用户看到的文本。

我不是在问如何实际限制字符数，因为我已经找到另一个 question 解决了这个问题，但我想知道如何在没有我的验证说明的情况下以用户友好的方式限制数据类似于 "Your data must be at most 500 characters" 时，大多数字符可以由用户看不到的 HTML 组成。

对于这样的问题，在前端或者数据库方面有什么解决方案吗？谢谢

Answer 1

如果没有看到您的实际代码很难说，但是您可以不显示字符数而是以编程方式从计数中排除您的 html 吗？您可以拥有一个结构类似于以下伪代码的函数：

div. Bind keydown event{
    var total = how many characters are in the div?
    if(are there any of the character sequences that match excluded html patterns?){
        var numCharacters = how many characters are in each excluded sequence?
        var calcCharacters = total - numCharacters
    }else{
        var calcCharacters = total
    }
    characterCountIndicator. update value(calcCharacters);
}

限制 contenteditable div 中存储在数据库中的字符数

Limiting the number of characters in a contenteditable div to store in a database

html

javascript

database

jquery

contenteditable