在输入字段中不允许空格作为第一个输入字符

时间:2019-01-03 10:37:05

标签: javascript regex

我输入了一个包含所有字符(包括空格)的名称输入字段。我想使用正则表达式不允许第一个字符为空格。用户必须输入至少一个有效字符,然后才能输入空格。 谢谢您的帮助。

3 个答案:

答案 0 :(得分:1)

  

我想使用正则表达式不允许第一个字符成为   空白。

除了使用正则表达式,您还可以捕获输入中的键,并防止在输入第一个字符时插入空格。

document.getElementById("input").addEventListener('keydown', function (e) {
  if (this.value.length === 0 && e.which === 32) e.preventDefault();
});
<input id="input"></input>

答案 1 :(得分:0)

您是要实现这样的目标吗?第一个字符永远不能是空格,在第一个字符之后必须是一些字符,然后它后面可以有无限多个空格。

<UserControl x:Class="UxHMI.LineChart"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:UxHMI"
         xmlns:oxy="http://oxyplot.org/wpf"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
<Grid x:Name="Container" Background="White">
    <oxy:Plot x:Name="myChart" Title="{Binding Title}" FontFamily="Bosch Sans Medium" Foreground="#FF0C6596" FontSize="19" Canvas.Left="298" Canvas.Top="32" Background="AliceBlue" Margin="0,0,10,0">
        <oxy:Plot.Series>
            <oxy:LineSeries x:Name="ls" Background="White" ItemsSource="{Binding Points}" LineStyle="Solid" Color="ForestGreen" MarkerType="None" MarkerSize="5" MarkerFill="Black">

            </oxy:LineSeries>
        </oxy:Plot.Series>
    </oxy:Plot>
    <Button x:Name="button" Content="Random" HorizontalAlignment="Left" Margin="0,278,0,0" VerticalAlignment="Top" Width="75" Click="button_Click"/>
</Grid>
const el = document.getElementById("demo");

// A function to encapsulate your logic. 
const process = e => {
  const v = el.value.toString().replace(/\ /g, '');

  // Must have length > 0 before the space bar will do anything. 
  if (v.length == 0 && e.which == 32) e.preventDefault();

  // First char must not be a space. 
  else if (el.value[0] == ' ') el.value = el.value.replace(/\ /, '');
};

// Do whatever here. 
const onChange = () => {
  el.onkeydown = process;
  el.onkeyup = process;
};


// Lazy on ready.. 
setTimeout(onChange, 100);

答案 2 :(得分:0)

您应该使用trim来验证多余的空间,然后查看是否至少添加了一个字符。

let str = "  ";
console.log(str);

if(!str.trim()) {
  console.log("At least a character required");
} else {
  console.log(str);
}

let correctStr = " a ";
if(!correctStr.trim()) {
  console.log("At least a character required");
} else {
  console.log(correctStr);
}