您正在使用this flatpickr
, 正当
因此,我不使用Elementor,因此,我没有使用Elementor或Elementor表单对此进行测试。然而,从我所看到的,您需要做的就是minDate
和dateFormat
工作,是添加以下内容:
if ( self.settings.dateFormat ) {
pickerSettings.dateFormat = self.settings.dateFormat;
}
该行上方:
self.modifyPicker( picker, pickerSettings );
因为您的最小值(&M);最大日期代码当前仅接受某些(或更准确地说,仅接受两个)自定义设置,即
minDate
和
maxDate
; 因此,对于其他设置,您需要像上面的示例一样手动添加它们。
当然,这种限制是可以消除的,但我想你(或脚本的作者)这样设计脚本是有充分理由的,所以我就顺其自然吧
因此,通过上述添加(pickerSettings.dateFormat
), 以下内容dateFormat
现在应该可以工作了:
limitFlatPicker.init( {
minDate: new Date(),
selector: \'#form-field-form_field_date\',
dateFormat: \'d/m/Y\' // this should now work with minDate
});
附加说明:您应该使用点符号代替数组符号,例如。pickerSettings.minDate
而不是pickerSettings[\'minDate\']
.
另一个JS提示(用于flatpickr
v4): 这个true
如中所示maxDate: true
将导致控制台中出现JS错误(因为true
不是有效日期),因此您应该使用maxDate: \'\'
. 好\'\'
不是有效日期,但空值被忽略flatpickr
. (即免于解析为日期)
更新您询问的评论:“<你能告诉我怎么加吗disableMobile: "true"
在这个代码中“参考资料”;
正如我在原始答案中所说的,您基本上只需要添加以下内容if
在self.modifyPicker( picker, pickerSettings );
:
if ( undefined !== self.settings.<setting name> ) {
pickerSettings.<setting name> = self.settings.<setting name>;
}
或者正如我所说的,你可以取消限制(即
easy设置自定义设置
flatpickr
) 这里有一种方法:只需更换整个
callback: function() { ... }
使用此选项:
callback: function() {
var self = limitFlatPicker;
$( self.settings.selector ).each( function() {
self.modifyPicker( this, jQuery.extend( {}, self.settings, {
selector: null,
} ) );
} );
}
关于
disableMobile
设置,我不知道是否设置为
true
(这是一个布尔值
true
, 不是字符串
\'true\'
, 虽然这也会起作用)将与您的主题或表单一起工作,因为它完全取决于您使用的主题和插件。因此,您只需尝试&;自己测试该设置。但是,您应该检查
mobile support 有关的信息
flatpickr
您可以找到所有可用设置以及每个设置的正确值
here.
更新2实际上,没有必要调用modifyPicker()
方法callback()
方法,所以在callback()
, 打个电话就行了flatpickr()
像这样:
callback: function() {
var self = limitFlatPicker;
$( self.settings.selector ).each( function() {
flatpickr( this, jQuery.extend( {}, self.settings, {
selector: null,
} ) );
} );
}
或者使用原始代码-但在添加
pickerSettings.dateFormat
和
pickerSettings.disableMobile
, 使用
flatpickr( picker, pickerSettings );
而不是
self.modifyPicker( picker, pickerSettings );
.
以及(即呼叫flatpickr()
直接)应解决此问题:<主要问题是dateFormat
在桌面上正常工作,但在移动设备上不工作“引用”;。
此外,我注意到您的waitForFlatpicker()
方法,因此您应该改为使用以下方法init()
和waitForFlatpicker()
代码:
init: function( options ) {
// [1]: Pass {} as the first arg so that this.defaultSettings doesn\'t get modified.
this.settings = jQuery.extend( {}, this.defaultSettings, options );
if ( this.settings.minDate || this.settings.maxDate ) {
// [2]: Pass the \'options\' and not this.callback
this.waitForFlatpicker( options );
}
// there should be an \'else\' here, but I assumed it\'s not necessary...
},
// [3]: The first arg is \'options\' and not \'callback\'
waitForFlatpicker: function( options ) {
if ( typeof window.flatpickr !== \'function\' ) {
setTimeout( function() { limitFlatPicker.waitForFlatpicker( options ); }, 100 );
}
else { // [4]: Make sure there\'s an \'else\'.
this.settings = jQuery.extend( {}, this.defaultSettings, options );
this.callback();
}
},
工作演示(在JS Fiddle上)
不是Elementor表单,但您会看到
minDate
,
dateFormat
和
disableMobile
一切正常
in this fiddle — 第一个输入在桌面和移动设备上看起来应该相同。
顺便说一下,我用了不同的callback()
如果只允许某些flatpickr
使用设置limitFlatPicker.init()
.