0

デフォルトでは、jQuery UI の datepicker は、日付が選択されるたびにカレンダー HTML をリセットします。カレンダーの要素を変更/追加 (画像、背景などを追加) し、日付がクリックされた後もそれらを保持できるようにしたいと考えています。

たとえば、このスクリプトは、24 日の青色の背景を持つインライン日付ピッカーとして開始します。別の日付 (たとえば 15 日) をクリックすると、HTML がリセットされ、青い背景が消えます。日付がクリックされた後、青色のままにしたい。

<script>

$(function(){
    $('#cal').datepicker({
        onSelect: function(dateText, inst) {
            console.log(dateText);
            // dont do anything else
        }
    });
    $('.ui-state-default:contains(24)').css('background-color','blue');
});

</script>   

<div id='cal'></div>

デモ: http://jsfiddle.net/DtvZM/

1 日をクリックすると、24 日が青から白に変わる様子をご覧ください。

注: これは問題を示すための単なる例であり、実際のコードではありません。

jQuery UI ウィジェット コードを変更する前に、これに対する簡単な解決策があるかどうかを調べています。

4

2 に答える 2

0

UIのdatepickerコードを変更しないとこれは不可能であると解決しました。これが私が最終的に行ったことです-

_selectDate メソッドで、次の行を変更しました。

if (inst.inline)
    this._updateDatepicker(inst);

に

if (inst.inline) {
    inst.stay = true;
    this._updateDatepicker(inst);
    inst.stay = false;
}

次に、_updateDatepicker メソッドで、変更しました

inst.dpDiv.empty().append(this._generateHTML(inst));

に

if (!inst.stay) {
    inst.dpDiv.empty().append(this._generateHTML(inst));
}

日付が選択されたときに UI がカレンダー HTML をリセットしないようになりました。

于 2012-05-18T05:47:36.973 に答える
-1

$('.ui-state-default:contains(24)').css('background-color','blue'); コールバック内で動かせないのonSelect？新しく選択された 24 も青になるようにするには、まだそれを行う必要があります。

また、代わりにクラスを追加して、実際のスタイリングを CSS に保持すると思います。

$(function(){
    $('#cal').datepicker({
        onSelect: function(dateText, inst) {
            console.log(dateText);
            $('.ui-state-default:contains(24)').css('background-color','blue');
            // dont do anything else
        }
    });
});

onSelect編集:ユーザーが最初に「24」を選択して青に変わったが、「17」を選択しても青のままになるように、それぞれのすべての .ui-state-default 要素をリセットする必要があると思います、 それで：

$(function(){
    $('#cal').datepicker({
        onSelect: function(dateText, inst) {
            console.log(dateText);
            $('.ui-state-default').css('background-color','transparent');
            $('.ui-state-default:contains(24)').css('background-color','blue');
            // dont do anything else
        }
    });
});
于 2012-05-17T23:51:11.210 に答える