0

jquery ui の datepicker の最新バージョンを使用して、選択した日付に応じて非表示の div を 1 つ表示したいと考えています。

アイデアは、日付ピッカーをインラインで表示することであり、ユーザーが日付を選択すると、その日付に対応する非表示の div が表示されます。

これが私がこれまでに得たものです... onSelect を使用する必要があると思いますが、他のスタックオーバーフローの質問に基づいてまとめるのに問題があります。

    $("#inlinedatepicker").datepicker({
    onSelect: function(date) {
        $('.tohide').hide();
        $('#date' + date).show();
    },
    inline: true,
    minDate: new Date(currentYear),
    beforeShowDay: function(date) {
        if (date.getDay() == 0 || date.getDay() == 1 || date.getDay() == 2 || date.getDay() == 3) {
            return [false, ''];
        } else {
            return [true, ''];
        }
    }
});

したがって、2013 年 1 月 1 日を選択すると、ID= date01/01/2013 の div が表示されます。スラッシュは受け入れられないと思うので、これを回避する方法はありますか?

2013 年 1 月 1 日の div の HTML は次のようになります...

<div id="date01/01/2013">...</div>
4

1 に答える 1

1

問題の 1 つは、onSelect イベント ハンドラに渡される「日付」が「2013 年 1 月 18 日」という形式の文字列である可能性があります (ブラウザのカルチャ設定によって異なります)。そして、この文字列（日付が追加されたもの）を使用してdivを選択しているようです。ただし、jQuery セレクターは、「/」などの特殊文字に遭遇すると例外をスローします。回避策の1つは、使用することです

document.getElementById('date' + date).style.display = "block"; // this works  
                                                                // with "date01/18/2013"

スラッシュなしでセレクター ID を設定し、onSelect イベント ハンドラーで文字列からスラッシュを削除して、それを jquery セレクターで使用することもできます。

于 2013-01-02T18:51:04.140 に答える