preventdefault 相关问题

设置值后如何在 HTML 文本区域中进行撤消？

我有一个 元素，我从中监听某些按键。就像用户键入 Tab 键一样，我会阻止更改焦点的默认操作，并在正确的位置添加制表符 </desc> <question vote="19"> <p>我有一个 <pre><code><textarea></code></pre> 元素，我从中监听某些按键。就像用户键入 <kbd>Tab</kbd> 键一样，我会阻止更改焦点的默认操作，并在正确的位置添加制表符。</p> <p>问题是当用户按下我要听的其中一个键时，撤消有点乱七八糟。如何使撤消/重做功能起作用？我考虑过监听 ctrl/cmd-z 和 ctrl/cmd-shift-z 按键，记录所有内容，并处理撤消/重做，但是编辑和上下文菜单选项不起作用......</p> <p>您可以通过使用制表符和回车键输入字母然后尝试撤消和重做来查看：</p> <p></p><div data-babel="false" data-lang="js" data-hide="false" data-console="true"> <div> <pre><code>const textarea = document.querySelector('textarea') textarea.addEventListener('keydown', function (event) { if (event.key == "Tab") { event.preventDefault() const cursor = textarea.selectionStart textarea.value = textarea.value.slice(0, cursor) + '\t' + textarea.value.slice(textarea.selectionEnd) textarea.selectionStart = textarea.selectionEnd = cursor + 1 } else if (event.key == "Enter") { event.preventDefault() const cursor = textarea.selectionStart textarea.value = textarea.value.slice(0, cursor) + '\n' + textarea.value.slice(textarea.selectionEnd) textarea.selectionStart = textarea.selectionEnd = cursor + 1 } })</code></pre> <pre><code><textarea cols="50" rows="20"></textarea></code></pre> </div> </div> <p></p> </question> <answer tick="true" vote="15"> <p>我认为问题的核心在于 JavaScript 与浏览器默认的撤销方法之间缺乏交互。使用 JavaScript 将文本附加到文本区域不会以任何方式告诉浏览器的“撤消”删除附加的文本，因为浏览器的“撤消”仅用于删除用户输入的文本，而不是 JavaScript 输入的文本。</p> <p>以您的代码为例。按下 Enter 后，您告诉事件侦听器 <pre><code>preventDefault</code></pre>，这完全阻止了 Enter 键将用户输入附加到文本区域。然后，您使用 JavaScript 合成输入，浏览器的“撤消”不会跟踪它。</p> <p>您可以使用<a href="https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand#Browser_compatibility" rel="nofollow noreferrer"><pre><code>document.execCommand()</code></pre></a>来克服这种缺乏互动的情况。您可以通过链接检查它的浏览器支持。</p> <p></p><div data-babel="false" data-lang="js" data-hide="false" data-console="true"> <div> <pre><code>const textarea = document.querySelector('textarea'); textarea.addEventListener('keydown', function (event) { const cursor = textarea.selectionStart; if (event.key === "Tab") { event.preventDefault(); // appends a tab and makes the browser's default undo/redo aware and automatically moves cursor document.execCommand("insertText", false, '\t'); } else if (event.key === "Enter") { event.preventDefault(); document.execCommand("insertText", false, '\n'); } });</code></pre> <pre><code><textarea cols="50" rows="8"></textarea></code></pre> </div> </div> <p></p> </answer> </body></html>

停止从冒泡刷到身体

我有一个图片轮播和一个图片库灯箱，它们都允许用户滑动浏览照片。但是，整个页面主体也有一个滑动事件，用于打开侧面板....

如何阻止 React Overlay 出现在特定错误上

我试图阻止 ResizeObserver 循环限制超出错误出现在我的反应应用程序的开发环境中。 错误是良性的 我怎样才能让 React 停止在我的

e.preventDefault();在我的模块表单中不起作用，我尝试了一切但找不到解决方案

有人可以帮助我吗？ preventDefault() 不工作，我尝试 addEventListener('click' or 'submit') 如果我把 click required 不工作但是如果我把 submit preventDefault 不工作我 loo ...

Vue.js：有没有办法让@submit.prevent出现在一个项目的所有表单上？

我意识到有一些片段是我每次都在重复的，有时我也会忘记。其中之一就是@submit.prevent。在所有的表单中，我必须写它来防止提交，我总是会 ...

event.preventDefault()不会停止按键或上键事件。

我试图使用一个模板变量从用户那里获取aadhar号码，由于aadhar是12位数，我需要在每4位数后显示空格。由于aadhar是12位数长，我需要在每4位数后显示空格。此外，由于aadhar号码包含...

使用iframe阻止默认的按键动作。

这是一个我真的不知道如何解决的问题。以我们托管的这个HTML5游戏为例：http:/www.scirra.comarcadeaction938-bits-runner - 警告有声音! 该页面托管在scirra.com上......

如何在Vanilla JS中做一个函数，把选中的属性放在单选输入之前？

我找不到这个问题的解决方案。需要用JavaScript把属性检查放在选定的输入之前的输入类型radio上。我试着用radioButton[i]来锁定所有元素......。

JQuery - 防止表单提交不工作

我创建了一个表单 如何防止使用jquery提交表单？

自动反应stopPropagation并阻止默认值

使用当前版本的react-dom和@ material-ui，我需要在相当多的地方停止Propagation和/或preventDefault。我从来没有遇到过像本文这样的问题，我想这不可能...

允许子元素使用jQuery继续/触发事件

我对文档对象具有以下代码：$（document）.on（'keydown'，function（event）{event.preventDefault（）;}）;是否有可能在子元素...的元素>] >>

更改选择值时防止加载页面

我在表单中得到这个选择标签，其中包含一个房间的名称“。$ rooms。”我有4个房间，因此此选择...

解除绑定后提交表格

$（“＃qwerq”）。submit（function（e）{e.preventDefault（）; var check = 0; if（$（“＃firstName”）。val（）==“”）{check = 1 ;} if（check！= 1）{$（“＃qwerq”）。unbind（“ submit”）; ...

无法使preventDefault起作用：item.preventDefault不是函数

我尝试创建一个js脚本，该脚本首先阻止默认设置，仅第二次放开链接以移动菜单，但是我无法使preventDefault正常工作，错误是：item.preventDefault不是...

在按键时绕过e.preventDefault（）}>

我正在尝试编写一个在网站上创建文本输入的用户脚本，但是在网站的javascript代码中，在按键上调用的函数或其他调用e.preventDefault（）的函数……

无需页面重装的JavaScript removeChild

我是编码的新手，在弄清楚删除H6时如何停止重新加载页面方面有些挣扎，我已经尝试过e.preventdefault，但似乎不起作用。我的项目是仅香草js。 ...

[cancelable为false时如何防止touchmove从默认操作

我写了一些代码，发生了一些问题，有人可以帮忙吗？ var obj = ....; obj.addEventListener（“ touchmove”，function（event）{.... .... if（event.cancelable）{if（event ....

Bootstrap表单在验证失败时不会取消提交

我正在尝试创建一个表单，该表单将在提交时向用户发送电子邮件。事实是，我使用了Bootstrap的表单模板，并且当我通过电话提交它并邮寄了错误的值（电话号码...

如何在Chrome中启用鼠标滚轮？

当我将页面滚动到特殊块时，我使用javascript禁用了鼠标滚轮。我使用了很多方法，但是所有方法都使用Firefox，而不是chrome。对于铬我找到一个特殊方法...

如何在onChange内使用e.preventDefault选择标签

有没有一种方法可以通过使用preventDefault停止更改选择标记值。我可以通过使用event.preventDefault来阻止输入更改值，但是无法阻止选择标记来自...