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>