如何将 ** return (this.innerText.length <= 200) ** 移动到函数

How to move ** return (this.innerText.length <= 200) ** to a function?

本文关键字:移动 函数 length return this innerText      更新时间:2023-09-26

我有这个

  onkeypress="return (this.innerText.length <= 200);"

在内容可编辑的div 中。

工作正常。

但是当我尝试将其移动到函数时

<script>
    function aa(){
    document.getElementById('div_id').innerText.length <= 200;
    }
</script>

更改内容分区的执行样式

  onkeypress="aa();"

它不再有效。

我添加alert('test');只是为了确保aa()正在执行。 它执行得很好。

HTML 内部的句柄

你漏掉了return

function aa(){
  // MUST ALSO RETURN HERE
  return (document.getElementById('div_id').innerText.length <= 200);
}
<!-- NEED EXTRA RETURN HERE -->
<div id="div_id" onkeypress="return aa()" contenteditable>
    <!--THIS ARE 200 CHARACTERS--> ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRS
</div>

在 HTML 中无需处理

var div = document.getElementById('div_id2')
div.onkeypress = function(){
  return (div.innerText.length <= 200);
}
<div id="div_id2" contenteditable>
    <!--THIS ARE 200 CHARACTERS--> ABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRSTUVWXYZABCDEFGHIJKLMNOPQRS
</div>

您缺少return关键字;

function check(editor) {
  return editor.innerHTML.length <= 200;
}
#editor {
  border: 1px solid grey;
  height: 100px;
}
<div contenteditable='' id="editor" onkeypress="return check(this);">
  Try typing here ...
</div>