从剪贴板粘贴时，具有 maxLength 的 HTML INPUT 元素丢失文本

对于我认为的基本问题找不到任何东西：

当您将剪贴板中的字符粘贴到设置了 maxLength 属性的 HTML 元素中时，当整个文本不适合 maxLength 时，似乎只会插入一段复制的文本。

使用 Chrome 89.0.4389.90（官方版本）和 Firefox 78.8.0esr 测试，行为相同。

是否有关于该行为的规范或标准？是否已经就此进行过任何讨论？

对不起，如果这是一个愚蠢的问题，也许我在这里遗漏了一些东西。

但 IMO 这种行为不是一件好事：我会导致数据丢失！不同意？

想象一下，您复制/粘贴一些 UUID、SHA-1 校验和、部分代码或法律文本，其中每个词都很重要：碎片可能会悄悄丢失！？甚至没有警告告诉您已达到 maxLength？

从键盘输入单个字符时，情况有所不同：您会立即获得视觉反馈，因此不会错过限制。

好的，通常文本输入字段可能不使用 maxLength...但是如果您在此后面有一个 sql 数据库，其中列具有固定长度，例如 VARCHAR(500)，您希望限制为 500 个字符（假设 sql DB 使用字符长度语义）

所以我认为它应该粘贴全部或不粘贴，而不是文本片段。

元素中是否有一个属性/CSS 样式来控制它？

最好的问候，塞布

不幸的是，您面临的是 maxlength 属性的预期工作。捕捉小于或等于 maxlength 的部分已经足够聪明了。如果您不希望它起作用，则必须通过 JavaScript 手动处理它，这非常简单。这是一个简单的例子：

function checkLength() {
  var input = document.getElementById("value")
  if (input.value.length >= 5) // 5 is your maxlength
     input.value='';
}

<input type="text" id="value" onInput="checkLength();"/>

以上代码在值大于指定长度时清除输入字段，这里不需要maxlength属性。如果您只想将此规范用于粘贴事件，则可以使用 onpaste 属性而不是 oninput。