2

我必须为我的项目使用 bootstrap-datepicker.js，但它不适用于掩码。

问题 1： 如果您在字段中切换，它将自动用今天的日期填充日期字段。理想情况下，它根本不会填充它。

问题 2： 一旦填充了日期字段，就很难将其空白。

first name: <input type="text">
birthdate:  <input type="text" class="date">
city:       <input type="text">

js：

$(function() {
    $(".date").mask("99/99/9999");
    $('.date').datepicker({
        format: 'mm/dd/yyyy'
    });
});

问题都源于这样一个事实，即掩码在焦点期间使用示例格式字符（“_ _ / _ _ / _ _ _ _”）填充字段，并且当焦点离开时，日期选择器试图在掩码之前解析示例字符有机会删除它们。datepicker 无法将这些特殊字符解析为日期，因此它选择的是今天的日期。

我认为，如果我能在 bootstrap-datepicker 尝试解析示例字符之前找到一种删除示例字符的方法，我的问题将得到解决。

我会提供一个 jsfiddler 示例，但我不知道如何在他们的网站上添加 bootstrap-datepicker.js 和 jquery.maskedinput.js。

谢谢你的帮助。

4

3 回答 3

9

我偶然发现了这个选项：

$('.date').datepicker({
        format: 'mm/dd/yyyy',
        forceParse: false
    });

令人惊讶的是，强制解析默认为真。该死的引导程序。问题已解决。

于 2013-10-10T20:44:32.373 回答
1

迟到的答案，但这是解构两个插件处理的事件序列后唯一对我有用的答案（截至此日期）。

var $date = $('.date');

$date.datepicker({
    format: 'mm/dd/yyyy'
});
$date.mask("99/99/9999");
$date.on('keyup', function(){
    if ($date.val() == '__/__/____'){
        // this only happens when a key is released and no valid value is in the field. Eg. when tabbing into the field, we'll make sure the datepicker plugin does not get '__/__/____' as a date value
        $date.val('');
    }
});

长解释

原来 datepicker 插件在 keyup 上调用了一个更新函数，在这种情况下，这是当您释放 TAB 键时触发的 keyup 事件。此更新函数调用 DPGlobal.parseDate() 函数，其行为大致如下：

DPGlobal.parseDate(''); // returns new Date(); aka. now
DPGlobal.parseDate('10/10/1983'); // returns a Date instance that points to 10/10/1983
DPGlobal.parseDate('__/__/____'); // is generated by the maskedinput plugin and is interpreted as an ilegal date, so the datepicker goes back to the origin of unix time, 1970

这可以通过更改 datepicker 库上的 parseDate 函数轻松解决，但如果您想保持代码可维护，这是一个很大的禁忌。然后，我们有一种骇人听闻的方式来拦截犯规值并在 maskedinput 将其交给 datepicker 之前对其进行更正。

希望能帮助到你！

于 2015-07-01T20:50:00.040 回答
-1

尝试使用其他类名来日期选择器并在您的 html 中混合

      $(function() {
        $(".date").mask("99/99/9999");
        $('.date2').datepicker({
             format: 'mm/dd/yyyy'
         });
      });

      birthdate:  <input type="text" class="date date2">
于 2013-10-10T17:32:00.270 回答