Wie Maxlength Grenze zu div-Element mit contenteditable Attribut hinzufügen?

Question

Ich habe contenteditable div und ich muss maxlength limit zu diesem Element hinzufügen. Es kann einfach durch Steuerelement keyup -Ereignis getan werden, aber wenn Benutzer große Menge an Text mit Strg + V einfügen, muss ich Benutzereingaben reduzieren. Auch ich muss sehr vorsichtig sein, weil es HTML sein kann. So kann nicht einfach Teilzeichenfolge verwenden. Gibt es eine Idee, wie es geht? Jede Hilfe wird mein Leben retten.

Answer 1

Das Einfügen in das div-Steuerelement erfordert die Steuerung des Eingabeereignisses. Ich kann mich nicht erinnern, wer mir hier für immer geholfen hat, aber wir benutzen diesen Code auf ein paar Seiten.

const limit = 200; 
rem = limit - $('#editor').text().length; 
$("#counter").append("You have <strong>" + rem + "</strong> chars left."); 
$("#editor").on('input', function() { 
    var char = $('#editor').text().length; 
    rem = limit - char; 
    $("#counter").html("You have <strong>" + rem + "</strong> chars left."); 
    console.log(char) 
    console.log(rem); 
    if (char >= 100) { 
     $("#counter").css("color", "#ff7777"); 
    } 
    else 
     $("#counter").css("color", "#111111"); 
    if(char>200) 
    { 
     //add your code to do what you want about too much text... 
    } 
}); 

Ich stehle das von jemandem hier. aber ich kann den Beitrag nicht finden .. so danke geht zu einem von euch wundervolles ppl.

EDIT ok habe es von this answer auf einem ähnlichen Post.