始める
カタログを作成します。 無限のネストを持つ製品カテゴリ/企業/サービスのツリーを作成する必要がありました。 各カテゴリはチェックボックスでマークできるため、後でマークされたすべてのカテゴリのリスト/配列を取得できます(たとえば、カテゴリを検索するため)。
私はそのような
木を書きました。 お気に入りのjQueryのプラグインとして実装されます)
できること:
- 空のdivが指定されている場合-指定されたスクリプトとサブカテゴリからすべてのカテゴリを読み込みます(ネストされたul、liにフォルダクラスがあり、ネストされたリスト(ul)がない場合)-ツリーは指定された再帰深度で指定されたスクリプトからこのリストを自動的に読み込みます要求されたデータと要求されたデータ)。
- 実行可能リストが指定されている場合、サブカテゴリを折りたたみ/展開し、必要なものをマークすることができます。これは、指定されたクラスによって強調表示されます
- 配列内の選択されたカテゴリ番号(チェックボックスの値)を取得します
- ダウンロードされたすべてのツリーブランチを検索し、指定されたdivで検索結果を表示する機能(検索用のdivを指定します。このdivでは、クエリを入力する行+結果を表示するdiv(空))
- 検索結果の数を制限できます(パラメーター内)
- 見つかった結果の1つをクリックすると、ツリーが開き、指定されたブランチが表示され、クラス(パラメーターで指定)によって強調表示されます。
- 親カテゴリをクリックすると、内部も目立つように指定できます
- 数に制限がある場合、追加のチェックボックスを選択しようとすると表示されるメッセージを設定できます。
何も忘れていないようです)
パラメータ:
- _loadPath-カテゴリのロード元のファイルへのパス。
- _loadLvl-サブカテゴリのデフォルト数-0-ネストされたすべてをロード
- _selectChildren-親を選択するときに子サブカテゴリを選択するかどうか
- _liminSelected-マークされたカテゴリの数を制限する
- _limitMessage-マークされたカテゴリの数を超えた場合のメッセージ
- _searchDiv-検索用のコンテナー(文字列とdivである必要があります)
- _showResult-見つかった検索結果の数が0からすべてを表示します。
- _hlClass-見つかったカテゴリが強調表示されるクラス
- _checkedClass-マークされたカテゴリを強調表示するクラス。
使用法:
$( '.sp-tree-container' ).tree({_loadPath: 'php/li.html' });
* This source code was highlighted with Source Code Highlighter .
少し説明しましょう。ネストされたリストを持つli要素にはフォルダクラスが必要で、表示されるすべてのulには展開クラスが必要です。 カテゴリ名をクリックするだけで、カテゴリ名がスパンにプッシュされ、サブブランチが最小化/展開されます。
まあ、すべてがそうです...
私はまだ多くの美しさを持っていないので、判断しないでください。 私は建設的な批判を受け入れます;)