0

jQuery UI datepicker ウィジェットを使用しており、値が変更されたときに入力に作用するスクリプトがあります。すべての入力に対して「input propertyChange」にバインドし、選択に対して「change」にバインドします。

問題は、datepicker ウィジェットの場合、ユーザーが手動で datepicker のテキスト ボックスに入力したときにのみイベントを取得することです。UI カレンダーを使用して日付を選択すると、入力の値は実際に変更されますが、イベントは発生しません。

次に、「onSelect」オプションを日付ピッカーに適用できることに気付きましたが、これは既存の日付ピッカーでは機能しないようです。

if (input.hasClass('hasDatepicker')) {
                        input.datepicker({
                            onSelect : function (dateTxt, element) {
                                alert('updated '+dateTxt);
                            }
                        });
                    }

ウィジェットが作成されたときにのみ onSelect を適用することを期待しているため、アラートは決して来ません。

しかし、私がしようとしているのは、必要に応じて特定のページにアタッチするユニバーサル スクリプトを作成することです。そのため、疎結合にする必要があります。この日付ピッカーの機能のように見える方法では、非常に硬直的であり、柔軟性にはあまり適していません。また、必要な各日付ピッカーに明示的な onSelect を追加しようとしましたが、少なくともユニバーサル入力 propertyChange ハンドラーをトリガーすることを期待して、onSelect で .change() を呼び出すだけでしたが、それでも機能しません!

日付ピッカーごとに明示的にコーディングせずに、外部ハンドラーに日付ピッカーの更新を取得させる方法に関する他のアイデアはありますか??

4

2 に答える 2

1

多分これはあなたが探しているものです：

$(document.body).on('change keyup','.datepicker',function(){    
    alert('updated ' + this.value)
});

http://jsfiddle.net/qebkB/6/

于 2013-07-17T19:53:53.317 に答える
1

次のように作成した後、関数を動的にバインドできます。

$('.datepicker').datepicker("option", "onSelect", 
   function (dateTxt, element) {
                                alert('updated '+dateTxt)

更新され たデモを見る

于 2013-07-17T19:35:17.380 に答える