0

jQuery UI のカスタマイズの最後の仕上げについて助けが必要です。私はうまく機能するこのjQuery Datepickerを持っています...しかし、私のためにもう1つのことをする必要があります。そのまま、 .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

次に、入力フィールドに変えて、.html() の代わりにval()を使用します。

マークアップ

<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 に答える