Question

正如标题所述，我有一个内容可编辑的div，并且希望将最大行数限制为X。如何使用jQuery或JS做到这一点。

修改2： 当它为新行创建div时，如何在粘贴文本时使它从最后一行（限制-最大行）继续？

Answer 1

您可以使用jQuery来计算contenteditable div中作为换行符创建的新div的数量，并在此数字达到给定限制时删除contenteditable属性。

注意：这可能不适用于IE，因为据我所知，IE在新行中使用<p>。

HTML：

<div id="test" contenteditable="true">--- Insert text here ---</div>

jQuery：

$(function(){
    $("#test").on("keyup", function(){
        if ($("#test div").length > 5) {
            $("#test").prop("contenteditable" , false);
        }
    });
});

Answer 2

我尝试在上一条注释中添加JavaScript示例的代码，但无法弄清楚该怎么做。所以...就在这里；我希望。

<script type="text/javascript">
    var tBox = document.getElementById("test");
    tbox.on("keyup", function () {
        if (tBox.innerText.length > 5) {
            tBox.prop("contenteditable", false);
        }
    });
</script>

如何限制contenteditable div中的行数

2 个答案: