如何使 JavaScript 阻止文本框内的 'space key'

Question

首先，我已经尝试过 this solution 但它对我不起作用，除非我将脚本放在 HTML 页面中（我没有这样做是因为我为所有脚本创建一个页面）。另一个可行但我不明白的解决方案是：

<input type="password" id="pwd" required pattern=".{8,16}" title="8 characters minimun, 16 characters maximum" name="fpwd" placeholder="Password" size = "13" onkeypress="return (event.keyCode != 32&&event.which!=32)>

所以，问题是：为什么第一个解决方案只有在脚本位于 HTML 页面时才有效？

Answer 1

每次用户在文本字段中输入字符时都会执行 onkeypress 事件处理程序。

根据环境（浏览器），输入的字符键码存储在事件的 keyCode 或 which 参数中。

如果字符代码等于 SPACE (32) 的键代码，事件处理程序 returns false，这会导致浏览器关闭事件，即阻止它将键入的字符添加到输入字段。

键入此代码段以查看不同的键码：

<input onkeypress="return console.log(event.keyCode || event.which), (event.keyCode != 32 && event.which != 32)" />

Answer 2

这样的事情怎么样：

document.getElementById("pwd").addEventListener('keydown', function (event)
{
    // if the keyCode is 32 ( space key was pressed )
    if (event.keyCode === 32) {
        // prevent default behaviour
        event.preventDefault();
        return false;
    }
});

如何使 JavaScript 阻止文本框内的 'space key'

How to make JavaScript block the 'space key' inside a textbox

javascript

passwords

onkeypress

工作fiddle：https://jsfiddle.net/a7yprnjd/