0

我需要帮助来完成 jQuery UI 定制的最后一步。我有这个很好用的 jQuery Datepicker……但我需要它为我做一件事。.html() 的输出是span。我需要表单文本字段而不是 spans。

在下面的示例中，我希望将日、月和年显示为表单字段；不像跨度。我考虑过使用多个 AltField，但我无法为每个 AltField 获得相应的 altFormat...所以感谢Rusln，我取得了很大的进步，但我无法实现表单字段部分。你自己看 ：

JS：

    $(".full_date").datepicker({
    showOn: 'button',
    buttonText: 'Here',
    dateFormat: 'DD, dd MM yy',
    altFormat: "yy-mm",
    altField: ".year-month",
    onClose: function (dateText, picker) {
        // getDate returns a js Date object
         var dateObject = $(this).datepicker("getDate");
        console.dir(dateObject);
        // Call Date object methods
        $("#date span").html(dateObject.getDate());
        $("#month span").html(dateObject.getMonth());
        $("#day span").html(dateObject.getDay());
        $("#year span").html(dateObject.getFullYear());
    }
});

HTML：

    <h1>Date Picker</h1>

<form class="date-picker">
    <label>full date</label>
    <input type="text" class="full_date" value="" />
        <label>year month</label>
    <input type="text" class="year-month"/>
</form>
<p id="day">Day of the week: <span></span> </p>
<p id="month">Month: <span></span></p>
<p id="date">Date: <span></span></p>
<p id="year">Year: <span></span></p>

我看了很多次，但到目前为止没有运气......我觉得我已经浏览了所有的 jQuery 文档几次。有人可以指出一些参考资料，以便我可以使该示例起作用吗？

请参阅JSFIDDLE上的示例

提前感谢您的时间和帮助。

格雷格

4

1 回答 1

0

只需将其转换为输入字段并使用val()而不是 .html()

标记

<p id="day">Day of the week: <input name="day" type="text"></input> </p>
<p id="month">Month: <input name="month" type="text"></input></p>
<p id="date">Date: <input name="date" type="text"></input></p>
<p id="year">Year: <input name="year" type="text"></input></p>

脚本

$(".full_date").datepicker({
    showOn: 'button',
    buttonText: 'Here',
    dateFormat: 'DD, dd MM yy',
    altFormat: "yy-mm",
    altField: ".year-month",
    onClose: function (dateText, picker) {
        // getDate returns a js Date object
         var dateObject = $(this).datepicker("getDate");
        console.dir(dateObject);
        // Call Date object methods
        $("#date input").val(dateObject.getDate());
        $("#month input").val(dateObject.getMonth());
        $("#day input").val(dateObject.getDay());
        $("#year input").val(dateObject.getFullYear());
    }
});

演示

于 2013-07-01T20:40:25.733 回答