gpt4 book ai didi

javascript - 限制 HTML 输入只允许粘贴

转载 作者:太空狗 更新时间:2023-10-29 15:32:21 27 4
gpt4 key购买 nike

是否可以在只接受粘贴输入的表单上输入 HTML?

作为我们注册过程的一部分,最终用户需要在基本的 HTML 输入表单中输入一个 20 个字符的标识 token 。理想情况下,用户只需将 token 复制/粘贴到适当的字段中。我们不想让用户手动输入,因为他们很可能会输入错误的字母,而且我们没有任何可靠的方法来验证输入。

token 来自桌面软件,需要粘贴到一个已经打开的网页(即他们从哪里下载软件)。因此,可点击链接不是一个可行的选择。

有没有办法做到这一点,例如通过Javascript?谢谢。


我的解决方案,改编自 SimplePi 的回答:

<html>
<body>
<script type="text/javascript">
function validate(evt) {
var theEvent = evt || window.event;
var key = theEvent.charCode || theEvent.which;

if(key >= 32 && (theEvent.ctrlKey === undefined || !theEvent.ctrlKey)) {
if(theEvent.preventDefault) theEvent.preventDefault();
else theEvent.returnValue = false;
}
}
</script>
<span>Textbox name</span> <br />
<input type="text" onkeypress='validate(event)' value=""/>
</body>
</html>

这适用于一些但不是所有的浏览器。 Mac 上的 Firefox 是我发现的唯一违规者 - 一般情况下 firefox 报告 ctrl-vv 完全相同,但在 Windows 上 theEvent.ctrlKey 成员可以区分两者。在 Mac 上做同样的事情显然需要按下/向上键来检查是否按下了 cmd。它是可行的,但未包含在此代码中,以防其他人希望使用它。

最佳答案

这是一个更强大的解决方案,我在上面的代码上进行了扩展。可能有点矫枉过正,但它适用于所有浏览器。下面的代码将:

  1. 使文本框像只读一样,但将遵循标签索引并设置焦点
  2. 通过鼠标或键盘支持所有剪贴板功能 win 和 mac
  3. 允许撤消、重做和全选

$( "#your_textbox" ).keypress(function(evt) {
// Note this could be a bit of overkill but I found some
// problems in Firefox and decided to go the distance
// including old windows keyboard short cut keys.
// Enumerate all supported clipboard, undo and redo keys
var clipboardKeys = {
winInsert : 45,
winDelete : 46,
SelectAll : 97,
macCopy : 99,
macPaste : 118,
macCut : 120,
redo : 121,
undo : 122
}
// Simulate readonly but allow all clipboard, undo and redo action keys
var charCode = evt.which;
//alert(charCode);
// Accept ctrl+v, ctrl+c, ctrl+z, ctrl+insert, shift+insert, shift+del and ctrl+a
if (
evt.ctrlKey && charCode == clipboardKeys.redo || /* ctrl+y redo */
evt.ctrlKey && charCode == clipboardKeys.undo || /* ctrl+z undo */
evt.ctrlKey && charCode == clipboardKeys.macCut || /* ctrl+x mac cut */
evt.ctrlKey && charCode == clipboardKeys.macPaste || /* ctrl+v mac paste */
evt.ctrlKey && charCode == clipboardKeys.macCopy || /* ctrl+c mac copy */
evt.shiftKey && evt.keyCode == clipboardKeys.winInsert || /* shift+ins windows paste */
evt.shiftKey && evt.keyCode == clipboardKeys.winDelete || /* shift+del windows cut */
evt.ctrlKey && evt.keyCode == clipboardKeys.winInsert || /* ctrl+ins windows copy */
evt.ctrlKey && charCode == clipboardKeys.SelectAll /* ctrl+a select all */
){ return 0; }
// Shun all remaining keys simulating readonly textbox
var theEvent = evt || window.event;
var key = theEvent.keyCode || theEvent.which;
key = String.fromCharCode(key);
var regex = /[]|\./;
if(!regex.test(key)) {
theEvent.returnValue = false;
theEvent.preventDefault();
}
});

关于javascript - 限制 HTML 输入只允许粘贴,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21605961/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com