jQuery datepicker 自动将第二个字段附加到第一个字段输入

发布于 2024-12-21 00:12:07 字数 1397 浏览 3 评论 0原文

我正在使用日期选择器字段,一个用于开始日期,一个用于结束日期。我已经让一切几乎按照我的要求工作,但是如果我没有默认日期,当选择开始日期字段时,我很难让结束日期字段自动更新。如果我有一个默认日期,那就没问题,但在这种情况下我需要它为空。我已经在 jsFiddle 上设置了代码,如果有人能指出我如何实现这个结果,我将非常感激。

http://jsfiddle.net/clj83/7TvKr/

下面是几乎可以工作的代码。

$(function(){
var dates = $('#cntnt01cd_fax, #cntnt01cd_telephone').datepicker({
    dateFormat: 'yy/mm/dd', changeMonth: false, changeYear: false, numberOfMonths: 3, showOtherMonths: true, selectOtherMonths: true,
    onSelect: function(selectedDate) {
        var option = this.id == 'cntnt01cd_fax' ? 'minDate' : 'maxDate';
        var instance = $(this).data('datepicker');
        var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
        dates.not(this).datepicker('option', option, date);
    }
});
});

<div class="form_title">
Start Date
</div>
<div class="datepicker">
<input type="text" class="cntnt01cd_fax" name="cntnt01cd_fax" id="cntnt01cd_fax" value="" size="30" maxlength="255" />
</div>

<div class="form_title">
End Date
</div>
<div class="datepicker">
<input type="text" class="cntnt01cd_telephone" name="cntnt01cd_telephone"     id="cntnt01cd_telephone" value="" size="30" maxlength="255" />
</div>

谢谢

I am using to datepicker fields, one for a Start date and one for an End date. I have got everything almost working as I require however I am struggling to get the End date field to update automatically when the start date field is selected if I don't have a default date. It work's fine if I have a default date in place but I need it to be blank in this case. I have setup the code on jsFiddle and would be extremely grateful if someone could point out how I can achieve this result.

http://jsfiddle.net/clj83/7TvKr/

Here is the code below which is almost working.

$(function(){
var dates = $('#cntnt01cd_fax, #cntnt01cd_telephone').datepicker({
    dateFormat: 'yy/mm/dd', changeMonth: false, changeYear: false, numberOfMonths: 3, showOtherMonths: true, selectOtherMonths: true,
    onSelect: function(selectedDate) {
        var option = this.id == 'cntnt01cd_fax' ? 'minDate' : 'maxDate';
        var instance = $(this).data('datepicker');
        var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
        dates.not(this).datepicker('option', option, date);
    }
});
});

<div class="form_title">
Start Date
</div>
<div class="datepicker">
<input type="text" class="cntnt01cd_fax" name="cntnt01cd_fax" id="cntnt01cd_fax" value="" size="30" maxlength="255" />
</div>

<div class="form_title">
End Date
</div>
<div class="datepicker">
<input type="text" class="cntnt01cd_telephone" name="cntnt01cd_telephone"     id="cntnt01cd_telephone" value="" size="30" maxlength="255" />
</div>

Thanks

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

眉目亦如画i 2024-12-28 00:12:07
$(document).ready(function(){     
        $(function() {
            $( "#v_map_1" ).datepicker({
            defaultDate: "-d",
            changeMonth: true,
            dateFormat:"dd-mm-yy",
            onClose: function( selectedDate ) {
                  var d=selectedDate.split("-");
                  var da=d[0];
                  var mo=d[1];
                  var yr=parseInt(d[2])+1;
                  var nd=da+"-"+mo+"-"+yr;
                  $( "#v_map_2" ).datepicker( "setDate", nd );
                 }
            });
            $( "#v_map_2" ).datepicker({
            changeMonth: true,
            dateFormat:"dd-mm-yy",
            });
        });
    });

试试这个
小提琴

$(document).ready(function(){     
        $(function() {
            $( "#v_map_1" ).datepicker({
            defaultDate: "-d",
            changeMonth: true,
            dateFormat:"dd-mm-yy",
            onClose: function( selectedDate ) {
                  var d=selectedDate.split("-");
                  var da=d[0];
                  var mo=d[1];
                  var yr=parseInt(d[2])+1;
                  var nd=da+"-"+mo+"-"+yr;
                  $( "#v_map_2" ).datepicker( "setDate", nd );
                 }
            });
            $( "#v_map_2" ).datepicker({
            changeMonth: true,
            dateFormat:"dd-mm-yy",
            });
        });
    });

Try this
fiddle

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文