将 jQuery UI 日期选择器分成 3 个单独的文本框

发布于 2024-12-08 16:06:50 字数 189 浏览 6 评论 0原文

有谁知道将 jquery-ui datepicker 的输入分成 3 个单独的框的优雅方法?

默认情况下,它的输入只是一个文本框:DD/MM/YYYY

我必须将输入分成 3 个单独的日期、月份和年份:DD, MMYYYY

Does anyone know of an elegant way of separating the jquery-ui datepicker's input into 3 separate boxes?

By default its input is just one textbox: DD/MM/YYYY

I have to separate the input into 3 separate ones for day, month, and year: DD, MM, and YYYY.

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

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

发布评论

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

评论(3

花落人断肠 2024-12-15 16:06:50
<input type='text' id='fullDate' name='fulldate'>
<!-- Your other HTML fields listed above -->

$('#fullDate').datepicker({
    onSelect: function(dateText, inst) {
        var pieces = dateText.split('/');
        $('#day').val(pieces[0]);
        $('#month').val(pieces[1]);
        $('#year').val(pieces[2]);
    }
})

工作示例 http://jsfiddle.net/jomanlk/7NgpQ/

<input type='text' id='fullDate' name='fulldate'>
<!-- Your other HTML fields listed above -->

$('#fullDate').datepicker({
    onSelect: function(dateText, inst) {
        var pieces = dateText.split('/');
        $('#day').val(pieces[0]);
        $('#month').val(pieces[1]);
        $('#year').val(pieces[2]);
    }
})

working example http://jsfiddle.net/jomanlk/7NgpQ/

活泼老夫 2024-12-15 16:06:50

您可以使用datepicker函数onClose然后获取该值。

请参阅此 http://jsfiddle.net/96FPU/

这仅在 dateFormat 被数组索引正确引用,即在我的示例中,它从日 = 索引 0、月 = 索引 1、年 = 索引 1 开始工作。另外,在我的示例中,我只是将值分配给 spans'

You can use the datepicker function onClose then grab the value.

See this http://jsfiddle.net/96FPU/

This will only work if the dateFormat is correctly referenced by the array index, i.e. in my example, it is working from day = index 0, month = index 1, year = index 1. Also in my example i am just assigning the values to spans'

辞旧 2024-12-15 16:06:50

您可以使用 .datepicker('dialog')方法来达到这个效果。

function onSelect(dateText, inst) {
    var pieces = dateText.split('/');
    for (var i = 0; i < pieces.length; ++i)
        $('.date:eq('+i+')').val(pieces[i]);
};

$('.date').click(function(event) {
    var d = $('.date').map(function() { return $(this).val() }).get().join('/');
    $(this).datepicker('dialog', d, onSelect, { dateFormat: 'dd/mm/yy' }, [10, 40]);
});

查看实际操作:http://jsfiddle.net/william/QHasQ/

You can use the .datepicker('dialog') method to achieve this effect.

function onSelect(dateText, inst) {
    var pieces = dateText.split('/');
    for (var i = 0; i < pieces.length; ++i)
        $('.date:eq('+i+')').val(pieces[i]);
};

$('.date').click(function(event) {
    var d = $('.date').map(function() { return $(this).val() }).get().join('/');
    $(this).datepicker('dialog', d, onSelect, { dateFormat: 'dd/mm/yy' }, [10, 40]);
});

See this in action: http://jsfiddle.net/william/QHasQ/.

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