javascript 插入日期时的动态智能日期掩码
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/11566560/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Dynamic Smart date mask while inserting date
提问by RetroCoder
Is there a way in javascript or jQuery to detect and change dynamically while typing a date for both a key input and a copy and paste to a text box?
javascript 或 jQuery 中是否有一种方法可以在为键输入和复制粘贴到文本框输入日期时动态检测和更改?
I'm trying to create a functional text box which has two digits such as a month.
我正在尝试创建一个具有两位数(例如月份)的功能文本框。
Since the month can be a number from 1 - 12 I want to enforce the first digit to be a 1 or a 0.
由于月份可以是 1 - 12 之间的数字,我想强制第一个数字为 1 或 0。
The trick that I'm trying to do however is when the text box first gains focus and a user beging to type a number, if that number is 2 - 9 I want a zero to automatically fill the first spot and then but the 9 in the second spot.
然而,我尝试做的技巧是当文本框第一次获得焦点并且用户开始输入一个数字时,如果该数字是 2 - 9 我想要一个零来自动填充第一个位置,然后是 9第二个位置。
Before I type anything this date input would look like so:
在我输入任何内容之前,这个日期输入看起来像这样:
__/__/_____
If I type a "1"
如果我输入“1”
1_/__/_____
If I type "2" should get
如果我输入“2”应该得到
02/__/_____
If I type "22" should get
如果我输入“22”应该得到
02/2_/_____
If I type "77" should get
如果我输入“77”应该得到
07/07/_____
I would be very interested for in an answer with code or a link to a tool that already does this or a link to a previous post?
我对带有代码的答案或指向已经执行此操作的工具的链接或指向上一篇文章的链接非常感兴趣?
Eventually I want to put it in a masked so 7/7/2011 or 7/7/11 or 07/07/2011 will alway fill to 07/07/2011. In the final final version I am trying to get the year to default to the current decade but have a drop down to each 10 year++ --.
最终我想把它放在一个掩码中,所以 7/7/2011 或 7/7/11 或 07/07/2011 将始终填充到 07/07/2011。在最终的最终版本中,我试图让年份默认为当前十年,但每 10 年 ++ -- 都会下降。
回答by Norguard
Why not attach a listener to the blur of the textbox, rather than to the user's typing.
为什么不将侦听器附加到文本框的模糊上,而不是附加到用户的输入上。
Think about the user experience if you were typing "1", and all of a sudden, the input started adding or removing zeroes to what you were doing, while you were doing it?
想一想如果您正在输入“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; }
}
}
Handling the year would be just the same, except that you'd be adding "20" to the start of whatever it is.
处理年份是一样的,只是你会在它的开头加上“20”。
Feel free to jQuery it up.
随意jQuery它。
回答by A.M.K
I believe that the functionality that you want is provided by the jQuery Masked Input plugin
我相信您想要的功能是由jQuery Masked Input 插件提供的
Demo: http://jsfiddle.net/SO_AMK/SEXAj/
演示:http: //jsfiddle.net/SO_AMK/SEXAj/
Please note that it also only allows numeric characters.
请注意,它也只允许数字字符。
回答by RetroCoder
Answer goes here... jQuery masked input plugin.
答案在这里... jQuery屏蔽输入插件。