具有最大长度和jquery的可编辑div

Question

有以下任务-我需要防止输入超过N个符号的内容编辑div与原生JS / JQuery，即用户输入10个符号，不能输入更多，只能清除。

<div contenteditable="true" placeholder="Текст сообщения" class="editable ng-valid ng-valid-maxlength ng-dirty ng-valid-parse ng-touched"></div>

Answer 1

这对你应该是有效的，小提琴是here

​

$('#editcontent').on('keydown', function(event) {
  $('span').text('Characters entered:' + $(this).text().length);
  if ($(this).text().length === 10 && event.keyCode != 8) /*delete*/ {
    event.preventDefault();
  }
});

body {
  padding: 10px 0 0 10px;
}
#editcontent {
  width: 200px;
  height: 50px;
  border: 1px solid blue;
}
#editcontent:after {
  color: #999;
  content: 'Enter text';
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="editcontent" contenteditable="true"></div>
<span></span>

​