如何伪造 jquery-ui-datepicker 的当前日期

Question

我正在实施一个自定义算法来根据一组规则禁用日期，这些规则也取决于当前日期。为了测试我需要将当前日期设置为特定日期。

我发现这个 thread 只是覆盖了 javascripts 日期函数。我的问题是，如果我这样做，日历将不再按预期工作。大多数时候所有的日子都不见了，有时所有的日子都被禁用了。

var oldDate = Date;
Date = function (fake)
{
    if( ! fake ) return new oldDate('02/26/2017');

    return new oldDate(fake);
}
Date.prototype = oldDate.prototype;

如何使用自定义当前日期测试日期选择器？它应该像设置一个 jsfiddle 一样简单（如果可能的话）： My current Fiddle

Answer 1

设置这个属性并尝试希望这个对你有帮助。

gotoCurrent

类型：Boolean

默认值：false

如果为 true，当前日期 link 将移动到当前选择的日期而不是今天。 代码示例：使用指定的 gotoCurrent 选项初始化日期选择器：

$( ".selector" ).datepicker({
  gotoCurrent: true
});

Answer 2

我不会试图愚弄 DatePicker，而是按逻辑去做。也就是说，如果我正确理解你的问题。考虑以下设计：

您有一个函数，它接受日期输入，并基于该函数运行您的算法，该算法根据输入日期计算无效日期。假设您的无效日期计算器算法有效，那就是真实的假日期，无论如何都无所谓。
使用此算法，您始终可以根据真实或虚假的当前日期得到一组无效日期。
将该数组提供给 DatePicker，您可以定义要禁用的日期。 (在beforeShowDay.)

效果很好，不需要 DatePicker hack。查看示例实现：

function calculateInvalidDatesBasedOnInputDate(inputDate) {
    // your algorithm
    // fake result here, to demonstrate how it works.
    return ["2/14/2017","2/19/2017","2/28/2017"];
}

var fakeCurrentDate = new Date("2017/02/02");

$('input').datepicker({
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    dateFormat: "m/d/yy",
    defaultDate: fakeCurrentDate,
    beforeShowDay: function(date){
        var string = jQuery.datepicker.formatDate('m/d/yy', date);
        return [ calculateInvalidDatesBasedOnInputDate(fakeCurrentDate).indexOf(string) == -1 ]
    }
});

参见 Fiddle here。

Answer 3

我不太确定你需要做什么，我通常会更改操作系统时间，无论如何，简单明了：

  
// DEMO mock date js browser
// comment uncoment to play arround, if you need to automate with or without mock date plain an simple:
mockDateTime('2018/02/02'); // with mock
// mockDateTime() // no mock


$('#date1').datepicker({
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    dateFormat: "m/d/yy"
});

function mockDateTime(mockDate){
   // to do: validate mock date
   if (mockDate !== undefined && mockDate.length > 0)
   {
     var __Date = Date;
     Date = undefined;
     Date = function()
     {
          // to do: more deep checks on arguments          
          if (arguments.length > 0)
          {
              return new __Date(arguments[0], arguments[1], arguments[2]);
          }
          return new __Date(mockDate);
     };
     Date.prototype = __Date.prototype;
   }
}

#ui-datepicker-div { font-size: 12px; }

 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">


Date Picker on input field: <input type="text" id="date1" name="date1"/> <br/>

Answer 4

可能想查看 $.datepicker.parseDate( format, value, options ) 功能。

A number of exceptions may be thrown:

'Invalid arguments' if either format or value is null

'Missing number at position nn' if format indicated a numeric value that is not then found

'Unknown name at position nn' if format indicated day or month name that is not then found

'Unexpected literal at position nn' if format indicated a literal value that is not then found

'Invalid date' if the date is invalid, such as '31/02/2007'

这是一种检查日期是否有效的方法，可以 return 根据您提供的日期值构建日期对象。然后您可以在脚本中使用它。

一种更快的方法是将计算机（或测试 VM）的日期和时间设置为未来或过去的日期和时间。这将传递给浏览器，然后 now() 或 date() 之类的函数会给您带来截然不同的结果。

如何伪造 jquery-ui-datepicker 的当前日期

how to fake current date for jquery-ui-datepicker

javascript

jquery

jquery-ui

datepicker

jquery-ui-datepicker