Question

我正在处理简单的表单和javascript验证功能。我唯一的问题是多个空格将作为有效条目读取。我需要确保表单实际填写而不是只是在每个字段中放置两个空格并提交表单。我怎么能阻止这种情况发生？如果第一个字符是空格，或者读取没有其他字符为false的任意数量的空格，是否有某种方法可以返回false？

Answer 1

使用字符串修剪功能在验证前修剪字符串。它应修剪前导和尾随空格。我在下面添加了一个示例，您可以在trim documentation from Mozilla Developer Network

上看到更多文档

var demoInput = document.getElementById('multipleSpaces');
var demoText = demoInput.value;

var output = document.getElementById('output');

alert('Initial text length: ' + demoText.length + ' \n trimmed length ' + demoText.trim().length);

<input type='text' value='  ' id='multipleSpaces'/>
<div id='output'></div>

Answer 2

你好Joel提到如果你想删除尾随空格你可以使用 .trim（）。如果要将字符串规范化为只有1个空格，可以使用以下代码段。

var str = "this     is sparta   ";
    str = str.trim()
    str = str.split(/[ ]{2,}/).join(' ')

//output: "this is sparta"

正则表达式/[ ]{2,}/查找多个空格并拆分字符串，然后.join(' ')将拆分的元素编译为1个字符串。你可以把它简化为以下：

str = str.trim().split(/[ ]{2,}/).join(' ')

Answer 3

假设您使用内置constraint validation而不是自己滚动，这似乎是<input>元素的pattern属性的一个很好的用例。结合必需的属性，这应该完成你想要的没有任何JS：

<form>
    <input
        type="text"
        pattern=".*\S.*"
        title="Must contain non-whitespace characters"
        required>
    <input type="submit" value="Submit">
</form>

检查caniuse以确保该属性在目标环境中正常运行。

如何从清除表单验证中停止多个空格？

3 个答案: