插入日期時的動態智能日期掩碼

有沒有在JavaScript或jQuery的方式來檢測和動態更改，同時鍵入一個鍵輸入和複製並粘貼到文本框的日期？插入日期時的動態智能日期掩碼

我試圖創建一個有兩位數的函數文本框，如一個月。

由於一個月可以數字1 - 12我要執行的第一個數字是1或0

，我試圖然而，這樣的伎倆是在文本框中第一如果這個數字是2 - 9，那麼獲得焦點並且用戶要輸入一個數字，我想要一個零點自動填充第一個點，然後是第二個點的9。

之前，我鍵入任何在此日期輸入看起來像這樣：

__/__/_____

如果我鍵入「1」

1_/__/_____

如果我輸入「2」應該得到

02/__/_____

如果我輸入「22」應該得到

02/2_/_____

如果我輸入「77」應該得到

07/07/_____

我將是與代碼的答案，或者一個工具，它已經這樣做了或鏈接到以前的帖子的鏈接很感興趣？

最終我想把它放在一個蒙面上，所以7/7/2011或7/7/11或07/07/2011將一直填充到07/07/2011。在最終的最終版本中，我試圖讓今年的默認值達到當前的十年，但是下降到每10年一次。

來源

2012-07-19 RetroCoder

從最終用戶的角度來看，我發現這些類型的東西*非常*令人討厭。當然，這只是我的看法。我會檢查用戶體驗堆棧交換的最佳方式來提供建議。他們可能已經有了完整的解決方案。 – 2012-07-23 19:51:00

爲什麼不把偵聽器附加到文本框的模糊處，而不是用戶的輸入。

想想用戶體驗，如果你輸入「1」，並且突然間，輸入開始在你正在做的事情中增加或刪除你正在做的事情的零值？

var dayInput = document.getElementById("day-input"); 
// usually, I'd just use event-listeners, but feel free to refactor 
dayInput.onblur = handleDayOrMonth; 

function handleDayOrMonth() { 
    var el = (this === window) ? event.srcElement : this, 
     number_string = el.value; 

    // checking that it's an actual number 
    if (!isNaN(parseInt(number_string)) { 
     if (number_string.length === 1) { el.value = "0" + number_string; } 
    } 
}

處理這一年將是一樣的，除了你會加入「20」到任何它的開始。

隨意jQuery它。

來源

2012-07-19 18:14:05 Norguard

如果輸入被屏蔽，用戶體驗不應受到影響。 – RetroCoder 2012-07-19 18:41:51

是的。如果遇到麻煩，理想的體驗就是讓用戶以任何他們想要的方式輸入他們的值，然後將其格式化爲表單POST的預期結果，並將其格式化回服務器。只有在以下情況下，纔會真正強制這些格式：a）您不會執行隱藏驗證，或者b）它是體驗的合法部分（例如時鐘或計時器上的填充0）。 – Norguard 2012-07-19 18:50:33

我喜歡這個想法。我已經看到了一個擴展視圖，就像「縮小」一樣，顯示了他們在同一時間輸入的內容，顯示了它如何在縮小的部分中神奇地將其自動格式化。 – RetroCoder 2013-01-04 20:24:20

我相信你想要的功能是由jQuery Masked Input plugin

演示提供：http://jsfiddle.net/SO_AMK/SEXAj/

請注意，它也只允許數字字符。

來源

2012-07-27 02:47:07

我已經在使用這個javascript了，如果你重新閱讀賞金描述的要求應該清楚。 – RetroCoder 2012-07-29 20:51:28

我能夠在keydown事件上綁定。感謝jsfiddle。我勉強給你50分。 – RetroCoder 2012-07-31 19:29:42

謝謝。對不起，我沒有迴應，但我沒有更好的解決方案，所以說什麼都沒有意義:) – 2012-07-31 20:08:18

答案去這裏... jQuery masked input plugin。

來源

2012-07-30 18:48:19 RetroCoder

插入日期時的動態智能日期掩碼

回答

相關問題