layDateの新しい「日付複数選択」と「破壊方法」の詳細な紹介

laydate によって現在実装されている関数:

1. 一度に複数のノードのレンダリングをサポートします。

2. レンダリングされたノードのレンダリングをサポートします。

3.lay-data 属性を追加して、現在のノードのlaydate設定を設定します。

4. 時間を素早く選択する機能を実装します。 (クイック選択)

5. 純粋な月と年をクリックして直接確認します。 (quickconfirm)

6. 時、分、秒の選択が不完全です。 (simpleModel & format)

7. 分割時間範囲の選択。 (rangeType & range)

8. クイック選択の 2 つのシナリオのサポートを追加しました。 (範囲とクイック選択)

9. 四半期の選択を追加しました (type:'quarter')

10. 第 n 週を週の始まりとして定義する機能を追加しました (weekStart)

11. このマークの背景を円形に対応(circleMark)

*新規追加

12. 日付選択複数選択(複数)

13. 破棄laydate (laydatePro.destory)

テストページ: https://sun_zoro.gitee.io/laydatepro/testLaydate.html

日付選択の複数選択のサポート:

現在の複数選択は日付型のみをサポートしています。個人的には、他の型、特に時間選択や日付時刻は基本的に役に立たないため、ユースケースがあってはいけないと考えています。また、laydate を使用するのはさらに困難になります。 , なぜなら、時間の選択 時間、分、秒の 3 つの列がある場合、複数の選択を行う必要があるため、どのような形式と効果が必要になるのでしょうか? したがって、現在は日付をサポートするもののみを考慮し、範囲はサポートしません。

最初の効果:

実装アイデア:

1. まず、複数回選択するかどうかを決定するパラメーター (複数) を追加します。 . もちろん、設定すれば必ず機能するわけではありません。上記の通り、範囲外の日付選択のみに対応していますが、設定を間違えても問題ありません。プラグインが内部処理を行っているため、条件を満たした場合のみ効果があり、条件を満たしていない場合はシングルのままです。

2. 内部ロジックは比較的分散しています。基本的に、initDate 中に複数の選択を検出し、設定されたセパレータで値を区切ってから、レンダリング時にロジックをわずかに変更します。それ以外の場合は、デフォルトの日付選択された値の値は同じですが、実際の値の範囲に従って描画されます。

その後、処理されるのはイベントです。日付をクリックして内部選択をトリガーします。複数選択と単一選択が区別されます。複数選択は、選択されているかどうかによって異なります。値が記録されます。単一選択の場合、ロジックは以前と同じままです。最終的に、解析は、laydate インスタンスに基づいて値文字列を生成します。複数選択の場合、選択された値は並べ替えられ、デリミタで結合してノードをバインドします。

3. 使用方法:

デフォルトの長方形エフェクト:

laydate 破壊の小さな関数laydatePro を追加します。 destroy('.laydate-test-area');

私は最近、この要件を 2 ～ 3 回目にしました。主に、ノードのタイプを切り替える必要がある場合などです。もっと単純なのは、レンダリング後にレイデートとして使用したくない、クリックしたときに再度ポップアップしないようにしたい、などです。

まず第一に、前の状況では、そのタイプを変更するか、その属性の一部を変更する必要があります。以前にlaydateProに関する私の他の投稿を読んだことがある場合は、現時点では、そのタイプを変更する方法がないことを知っているはずです。 laydate は table のようにリロードしやすいので、元のものを破棄して再度レンダリングすることを考えました。

しかし、重要なポイントを把握する方が簡単です。破棄の別の形式は、ノードを再生成することです。最終的な影響は、元のlaydateインスタンスが現在のノードと何の関係もなくなり、認識されなくなることです。それ。

実装方法:

実際に中心となるのは、円内の 2 行のコードであることがわかります。破棄するノードのクローンを作成し、その後、クローンを作成します。元のノードは置き換えられているため、基本的にユーザーにとっては影響を受けないプロセスです。レイキーを削除することを忘れないでください。これにより、基本的にクリーンなノードになり、後でレンダリングしたいものを自由に使用できるようになります。

推奨: layui フレームワーク クイック スタート

以上がlayDateの新しい「日付複数選択」と「破壊方法」の詳細な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。