-3

私はjQueryのDatepickerプラグインについていくつかの調査を行ってきました。彼がどのようにノードを作成して変更したのか興味がありました。

私が見つけたものは興味深いものでした:

@ 113:   this.dpDiv = bindHover($('<div id="' + this._mainDivId + '" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>'));

bindHover関数は、考慮することはそれほど重要ではありません。参照を取得し、マウスオーバーなどのいくつかのイベントを委任します。

興味深いのはid属性で、this._mainDivIdと表示されているので、チェックアウトして...

@ 34:       this._mainDivId = 'ui-datepicker-div'; // The ID of the main datepicker division

一意のIDは使用されず、セットIDです。1ページに複数の日付ピッカーが使用されることが多いため、一意である必要があると考えました。

これはjQueryです、それは良い習慣でなければなりません...私はこれがなぜまたはどのように役立つのか理解できません。

4

3 に答える 3

3

これは、2つの入力に日付ピッカーを追加して生成されたhtmlです。次の例を参照してください:http://jsfiddle.net/AC5Py/

<body>
<input id="picker1" class="hasDatepicker">
<input id="picker2" class="hasDatepicker">
<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" style="position: absolute; top: 21px; left: 168.7px; z-index: 1; display: block;">
</body>

ページに追加された日付ピッカーコンポーネントは1つだけのようで、ページで確立された日付ピッカーとして指定されたすべての入力で再利用されます。基本的に、彼らはカレンダー用に生成されたマークアップを再利用しています。

于 2013-01-13T23:57:23.453 に答える
3

ソースを見ると、ページには多くの日付ピッカーインスタンスが存在する可能性がありますが、一度に開いている日付ピッカーウィンドウは1つだけです(例を参照)。すべてのdatepickerは同じdpDiv要素を使用してコンテンツを表示するため、divには単一の一意のIDが与えられます。

于 2013-01-13T23:57:48.047 に答える
1

jqueryを介して入力にdatepickerを追加すると、次のように実行されます

$('#startDate').datePicker({..});

一意のIDはstartDate jqueryであり、特定の日付ピッカーをレンダリングしている間、IDとクラスの変更を処理します。一度に表示できる日付ピッカーは1つだけです。同じIDを自分で指定しない限り、同じIDを持つさまざまな要素について心配する必要はありません。すべて問題ありません。

于 2013-01-13T23:57:01.607 に答える