我花了几个小时在我的代码中追踪这个问题，其中 ESC正在清除输入文本只是为了发现这不是我的代码。我发现 ESC清除 <input type="search" /> 中的文本.
所以当我发现这个时，我认为我所有的问题都解决了 - 只删除了 type="search"删除按钮以清除输入中的当前文本。我想我可以用一个快速的 CSS 规则来恢复它，但它没有效果。
-
-webkit-appearance: searchfield;
接下来我尝试阻止 ESC 的操作在搜索字段上，但无法通过以下方式执行此操作:
-
evt.preventDefault() -
evt.stopPropagation() -
evt.stopImmediatePropagation()-- 技术上 React 等效evt.nativeEvent.stopImmediatePropagation()
如何在不在 DOM 中或在我的代码中重新发明浏览器的这一内置功能的情况下解决这个问题？
最佳答案
您可能必须跟踪该值并将搜索框值设置为按下 esc 键时的最后一个值。
像这样的东西可能有用...
<!DOCTYPE html>
<html>
<head></head>
<body>
<input type="search" id="searchInput" />
</body>
<script type="text/javascript">
let searcText = "";
const input = document.getElementById("searchInput");
input.onkeyup = (e) => {
if(e.keyCode === 27) {
input.value = searchText;
return;
}
searchText = input.value;
}
</script>
</html>关于javascript - 防止 ESC 在 Chrome 上清除 <input type ="search"> 中的文本(或添加按钮以清除文本而不使用类型 ="search")，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/63061605/