html＆js文本字段数据（DD-MM-YYYY）验证

Question

在我的表单中，我有一个用户输入日期的文本字段。 良好的习惯告诉我，不要让用户在字段中输入除dgit和'-'符号以外的任何内容。

但是我在实现这样的功能时有点问题。 到目前为止，我有一个仅接受数字的字段。 如果用户尝试输入字段字母，该字母将被删除。 但是关键是要创建(DD-MM-YYYY)格式，因此字段必须接受'-'符号。

这是我的代码：

<input type="text" name="test3" placeholder='DD-MM-YYYY' onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')"/>

我试图将|\\-放入正则表达式中，但没有成功。 谁能指出我在哪里做错了？

Answer 1

您可以尝试类似

<input type="text" name="test3" placeholder='DD-MM-YYYY' onkeyup="if (/[^\d-]/g.test(this.value)) this.value = this.value.replace(/[^\d-]/g,'')" onchange="validate(this)"/>

function validate(el){
    var regex = /^(0?[1-9]|[12][0-9]|3[01])-(0?[1-9]|1[012])-\d{4}$/;
    if(!regex.test(el.value)){
        alert('invalid date');
        el.value = '';
    }
}

演示： 小提琴

Answer 2

HTML5为您提供了另一种方法：

<input type="date" name="test3">

但是，浏览器负责日期显示的格式设置。

Answer 3

使用正则表达式

/ ^ \\ d {4}-\\ d {2}-\\ d {2} $ | [^ \\ d-] |-\\ d {2}-\\ d *-/

你也可以

 **/^\d{4}-\d{2}-\d{2}$|[^\d-]|-\d{2}-\d*-/.test(input.value)** 

Answer 4

您可以使用HTML5做到这一点

看到我的jsfidle： http : //jsfiddle.net/H7tMZ/2/

<form>
    <input type="text" name="date" pattern="\d{1,2}-\d{1,2}-\d{4}" placeholder="dd-mm-jjjj"/>
    <button type="submit"/>
</form>