【问题标题】:Get value from date input on keypress event从按键事件的日期输入中获取值
【发布时间】:2012-10-27 21:48:57
【问题描述】:

有没有办法从按键事件中的日期输入字段中获取当前值?我已经毫无困难地在按键事件中的文本输入字段上使用了 jQuery .val() 函数或直接的 javascript .value,但是当我在日期输入字段上尝试其中任何一个时(在支持它的浏览器中,例如 chrome ),我只得到一个空字符串 - 显然在输入有效日期之前不会设置该值。

我正在使用此功能允许用户输入仅六位数字的日期,例如 110712,并在键入时自动添加斜线以生成 11/07/12。当然,我可以只使用纯文本输入,但我喜欢日期类型字段在支持它的浏览器上为我提供的弹出日期选择器。

编辑: 也许我不清楚我想做什么。从附加到日期输入字段的按键处理程序中,我想获取用户当前在该字段中键入的内容。例如,如果用户已经输入了“11”,然后输入了“0”,我希望能够看到该字段的当前值为“11”。使用基本文本输入(或不支持日期输入字段的浏览器),我可以从按键事件处理程序中调用 .val() 或 .value ,它会给我一个“11”的结果。然而,在支持日期输入字段的浏览器中,调用 val() 或 .value 时我得到的只是 ""。

【问题讨论】:

    标签: javascript


    【解决方案1】:

    更新:

    不幸的是,这似乎无法做到。考虑 input[type="date"] 一个选择,其中选项是历史中的每个日期,而不是文本框。 http://www.html5tutorial.info/html5-date.php 上面的链接显示了其他浏览器正是以这种方式实现的。请注意,只要您的文本框具有有效日期,.val() 就会获取该值。

    您可以同时使用 input[type="text"] 和旁边的一个小的 input[type="date"] 来完成混合,以便在更改时将其值转储到文本框中。

    工作示例:http://jsfiddle.net/WaAcU/(这不会进行验证,只是将选择器转储到文本框中)

    原答案:

    使用 JQuery 按键处理程序。

    $(dateField).keypress(function(){
        ...your validation code...
    });​
    

    简单的例子: http://jsfiddle.net/zUMHr/

    【讨论】:

    • 啊,我跟着。日期字段只为有效日期注册一个 val()。马上回来!
    • 看起来你运气不好,无法直接回答:updates.html5rocks.com/2012/08/…
    • 问题在于浏览器处理它的方式,从我对元素对象的探测来看,它的所有公开属性都不包含正在输入的文本。看起来唯一的方法是使用 input[type="text"]
    【解决方案2】:
    $("#clickme").keypress(function(event){
        alert(event.timeStamp);
      alert(new Date(event.timeStamp));
    
        var fullDate = new Date()
    console.log(fullDate);
    //Thu May 19 2011 17:25:38 GMT+1000 {}
    
    //convert month to 2 digits
    //  var twoDigitMonth = ((fullDate.getMonth().length+1) === 1)? (fullDate.getMonth()+1) : '0' + (fullDate.getMonth()+1);
    
     //  var currentDate = fullDate.getDate() + "/" + twoDigitMonth + "/" + fullDate.getFullYear();
     // console.log(currentDate);
        // $("#clickme").val(currentDate);
    //08/11/2012
    });
    

    jsfiddle working example

    上面的例子显示了current date on keypress event

    【讨论】:

    • 是的,显示当前日期。但我想获取用户在日期输入框中输入的内容,而不是实际日期。如果浏览器确实支持日期输入字段,.val() 只会返回一个空字符串。
    猜你喜欢
    • 1970-01-01
    • 2016-12-26
    • 1970-01-01
    • 2020-12-30
    • 2011-03-28
    • 1970-01-01
    • 1970-01-01
    • 2021-01-06
    • 2020-04-21
    相关资源
    最近更新 更多