自上次 chrome 更新以来，我的 HTML 输入字段默认为“只读”

Posted 2023-02-22

【中文标题】自上次 chrome 更新以来，我的 HTML 输入字段默认为“只读”

【英文标题】：My HTML input field is "readonly" by default since the last chrome update

【发布时间】：2021-09-29 15:54:20

【问题描述】：

我网站的几个用户来向我解释说，无法再单击复选框或单击“添加文件”按钮（输入类型文件）

在将 Google chrome 更新到版本 92.0.4515.107 之前，我未能重现该问题

我可以看到我的 CSS 类之一覆盖了默认参数，因为 Google chrome 将我的输入视为只读输入

https://jsfiddle.net/Lfjctwb1/

示例：

<div class="form-check">
  <input class="form-check-input" type="checkbox" id="confirm-checkbox" required="">
  <label class="form-check-label" for="confirm-checkbox">
    <strong>I confirm</strong>
  </label>
</div>

<br>
<br> 

<input type="file" name="my_file" required />

我的 CSS 类覆盖：

.disabled, input:read-only 
    pointer-events: none;

如何在不修改所有输入的情况下修改我的类？

【问题讨论】：

好吧，别管我之前的评论了。我刚刚发现我自己还没有更新。哇！这确实是一个糟糕的、糟糕的变化，可能会破坏很多事情......看起来不在<form> 标签中的表单元素现在默认被视为只读？

@ConstantinGroß 导致它的代码中没有其他内容。我刚刚在 chrome 更新后确认它会触发 :read-only。 @Rocstar，也许你可以使用 [readonly] 选择器而不是 :read-only。你真的需要那门课吗？

您实际上可能在 Chrome 中发现了一个错误……但到目前为止，我还没有发现对我自己的任何项目有任何影响……仍在试图弄清楚这里发生了什么！很有趣！

你可能想在bugs.chromium.org/p/chromium创建一个工单

@ConstantinGroß 感谢您的关注，输入 [只读]​​ 有效！

【参考方案1】：

这按规范按预期工作，不会被修复。

https://html.spec.whatwg.org/multipage/input.html#attr-input-readonly https://html.spec.whatwg.org/multipage/semantics-other.html#selector-read-only

更多信息：https://bugs.chromium.org/p/chromium/issues/detail?id=1259187