html - 输入只读退格问题

Question

在我的input元素中，当我导航到元素并使用键盘输入退格键时，它会导航到上一页，当我将输入设置为readonly.

我的代码如下。请分享你的知识。

<div class="div1">
    <label class="div1" for="inputfor">cash:</label>
    <input type="text" id="cashinput" readonly="readonly" />
</div>

Answer 1

我知道这个问题是在 2 年前提出的。由于我有一个对我有用的解决方案，我很想与大家分享它。

修复非常简单：

<input type="text" onkeydown="event.preventDefault()" readonly="readonly"/>

event.preventDefault() 将阻止退格键离开页面，您还可以选择和复制文本。

谢谢。

Answer 2

您始终可以将输入字段保持为只读状态，完全禁止输入。

<div class="div1">
    <label class="div1" for="inputfor">cash:</label>
    <input type="text" id="cashinput" onkeydown="return false;" readonly="readonly"/>
</div>​​​​​​​​​​​​​​​

Answer 3

对于具有只读属性的输入，这是预期的正确行为。

具有此属性的输入无法修改，只能查看，您可以通过 Tab 键和复制访问内容，仅此而已。

如果不需要，请删除 readonly 属性。

Answer 4

这条线帮助了我：

onkeydown="if(this.readOnly) event.preventDefault();"

Answer 5

如果您因为 location.href = "new/page/url" 而在页面中；

改用 location.replace("new/page/url") 。

location.href = "新/页面/网址"; // 加载新页面并将当前页面保存为 IE 中的历史记录

参考 https://developer.mozilla.org/en-US/docs/Web/API/Location