Question

我需要帮助才能最后触摸jQuery UI自定义。我有这个jQuery Datepicker工作得很好......但我需要它为我做一件事。原样，.html（）的输出为 span 。我需要表单文本字段而不是跨度。

在下面的示例中，我希望将日，月和年显示为表单字段;而不是跨度。我考虑过使用多个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文档。有人可以指出一些参考资料，以便我可以让这个例子起作用吗？

请参阅EXAMPLE ON JSFIDDLE

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

格雷格

Answer 1

然后转到输入字段并使用 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());
    }
});

<强> Demo

将datepicker .html（）对象创建为文本字段，而不是跨度

1 个答案:

标记

脚本