交互式地，不允许文本输入中的第一个字符是一个空格或一组空格

Question

首先，这不是一个重复的问题。我遇到的大多数类似问题都不会以交互方式执行所需的操作（例如“onkeydown”、“onkeyup”等）。我需要一个纯 JavaScript（即NO jQuery）函数来禁止基于文本的输入的第一个字符是仅给定元素 ID 的空格或空格组。这是我所拥有的：

<script type="text/javascript">

/* Don't allow the first character of a "text-based" input element
 * (e.g. text-box, text-area, editable-div's) to be a space, given
 * the elements ID ([ eID ]). [BEGIN]
 */

function noPrecedingSpace ( eID )
{

    var elmt = document.getElementById(eID);

    elmt.addEventListener("keydown", function(event)
    { 
        var strg = elmt.value;
        var lastChar = strg.charAt(strg.length - 1);

        if ((lastChar == " ")||(lastChar == "&nbsp;")||(strg == ""))
        {
            return event.which !== 32;
        };
    }); 

};

/* Don't allow the first character of a "text-based" input element
 * (e.g. text-box, text-area, editable-div's) to be a space, given the
 * elements ID ([ eID ]). [END]
 */

</script>

关于为什么这不起作用的任何想法？

我究竟做错了什么？

请注意：“粘贴”已经被考虑在内，并且被另一个 javascript 禁止在现场使用，顺便说一下，它运行良好。

JSFiddle

Answer 1

返回 true/false 是管理事件传播的“旧”方式。现在更好的是使用preventDefault()

var elmt = document.getElementById('noSpaces');

elmt.addEventListener('keydown', function (event) {
    if (elmt.value.length === 0 && event.which === 32) {
        event.preventDefault();
    }
});

这只是检查...如果当前输入长度为零，则不允许使用空格。

另见小提琴。

您也可以添加/修改以检查不间断空格，如果这真的是一个问题 - 与 Dave 的答案之类的正则表达式匹配，但前提elmt.value.length是> 0

但是，这将允许您键入非空格，然后备份到字段的开头并插入空格。
一个修改后的小提琴装饰前导空格在您输入，但是这也不能完全解决问题。

var elmt = document.getElementById('noSpaces');

elmt.addEventListener('keydown', function (event) {
    if (event.which === 32) {
        elmt.value = elmt.value.replace(/^\s+/, '');
        if (elmt.value.length === 0) {
            event.preventDefault();
        }
    }
});

您可以继续改进它，甚至考虑当前插入符号位置和当前选择的文本，但最终您必须 .trim()在服务器上收到字符串，因为我（对于一个）可以向您发送任何我想发送的内容，尽管您javascript 努力让我输入一个“合法”的字符串。