gpt4 book ai didi

javascript - 如何使 Datebox Jquery Mobile 输入字段可点击?

转载 作者:太空宇宙 更新时间:2023-11-03 23:36:13 25 4
gpt4 key购买 nike

我有两个日期字段。字段 2 工作正常。单击第二个字段的输入类型日期的任意位置可打开日历。但同样不适用于第一个日期字段。当我点击日期字段的日历图标时,它会打开日历,但我希望当我点击字段 1 的日期字段上的任意位置时,日历也应该弹出。为什么它适用于第二个字段而不适用于第一个字段。

此外,默认日期未设置为今天的日期。

http://jsfiddle.net/KJ4e5/3/

HTML

<body>
<div id="doc">
<table>
<tr>
<td>

<input name="date1" id="date1" type="date" data-role="datebox" data-options='{"mode": "calbox","dateFieldOrder":["d","m","y"], "useNewStyle":true,"overrideDateFormat": "%d/%m/%Y", "afterToday":true}' />
</td>
<td>

<input name="date2" id="date2" type="date" data-role="datebox" data-options='{"mode": "calbox","dateFieldOrder":["d","m","y"], "useNewStyle":true,"overrideDateFormat": "%d/%m/%Y", "afterToday":true}'/>
</td>
</tr>
</table>
</div></body>

//JS

$( document ).on( "pageinit", "#doc", function() { 
var defaultPickerValue = new Date();
var today = defaultPickerValue.getDate() + "/" + (defaultPickerValue.getMonth()+1) + "/" + defaultPickerValue.getFullYear();

$('#date1').val(today);
$('#date2').val(today);

$('#date1').on('change', function() {
if ( $('#date2')) {
$('#date2').val($('#date1').val());
var temp = new Date();
var start = $('#date1').datebox('getTheDate');
var diff = parseInt((start - temp) / ( 1000 * 60 * 60 * 24 ));
diffstrt = (diff * -1)-1;
$("#date2").datebox("option", {
"minDays": diffstrt
});
}
});

});

最佳答案

我无法解释为什么这两个框的行为不同,但如果您明确地将 useFocus 选项分配给框,它们都会起作用:

<input name="date1" id="date1" type="date" data-role="datebox" 
data-options='{"mode": "calbox","dateFieldOrder":["d","m","y"],
"useNewStyle":true, "overrideDateFormat": "%d/%m/%Y",
"afterToday":true, "centerHoriz": true, "useFocus": true}' />

Here is your updated FIDDLE

在 fiddle 中,我还对您的脚本做了一些改动。使用日期框,您可以按如下方式设置日期:

var defaultPickerValue = new Date();
$('#date1').datebox('setTheDate', defaultPickerValue).trigger('datebox', {'method':'doset'});


$('#date1').on('change', function () {
if ($('#date2')) {
var temp = new Date();
var start = $('#date1').datebox('getTheDate');
$('#date2').datebox('setTheDate', start).trigger('datebox', {'method':'doset'});
var diff = parseInt((start - temp) / (1000 * 60 * 60 * 24));
diffstrt = (diff * -1) - 1;
$("#date2").datebox("option", {
"minDays": diffstrt
});
}
});

关于javascript - 如何使 Datebox Jquery Mobile 输入字段可点击?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24015584/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com