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

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();
    }
});

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

另请参阅fiddle .

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

但是，这可以让您输入非空格，然后备份到字段的开头并插入空格。
一个revised fiddle在您键入时 trim 前导空格，但这也不能完全解决问题。

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() 您在服务器上收到的字符串，因为尽管您费了很大力气让我输入“合法”字符串，但我(仅此而已)可以向您发送我想发送的任何内容。