layUIノートとタブにサイドナビゲーションを配置する方法

layUIの概要は使いやすく
ここに画像の説明を挿入します

cssが導入されています
ここに画像の説明を挿入します

ここに画像の説明を挿入します
ページ要素の仕様と説明
css命名規則
クラス命名プレフィックス:layui、コネクタ:-など:class = "layui-from"
命名形式は、一般に2つのタイプに分けられます
。1つ:layui-モジュール名-遷移またはタイプ、
2つ: layUI-遷移またはタイプ。一部のクラスはモジュールに固有ではないため、通常は次の
ようなパブリッククラスです。1(ボタンの元のスタイルを定義):class = "layui-btn layui-btn-primary"
2(インラインブロック要素を定義):クラス=“ layui-inline”
html仕様:共通の共通属性
さまざまなタスクをトリガーする必要があるため、カスタム属性
ここに画像の説明を挿入します
フォームが必要です
実装方法
。コンテナにclass =“ layui-from”を設定して、フォーム要素のブロック
依存モジュールを識別します。関連する動的操作を使用しフォームの
ここに画像の説明を挿入します
html
ここに画像の説明を挿入します
属性のレンダリング更新する方法form.render(type、filter);メソッド1、type:はフォームフォームのタイプタイプです。実行する必要のある双方向のバインディングメカニズムはありません。.render()//すべてのform.render( "Select")を更新//選択ボックスのレンダリング2を更新します。filterは、class = "layui-form"が配置されている要素のlay-filter = ""の値です。 、これは、送信フォーム送信イベントを監視するID同等です
ここに画像の説明を挿入します

ここに画像の説明を挿入します







ここに画像の説明を挿入します


ここに画像の説明を挿入します
フォームの検証
では、lay-venify = ""属性値をテーブルに追加するだけで済みます
ここに画像の説明を挿入します

ボタン
ここに画像の説明を挿入します
ナビゲーション
ここに画像の説明を挿入します
サイドナビゲーション
ここに画像の説明を挿入します
ブレッドクラム
ここに画像の説明を挿入します
テーブル
ここに画像の説明を挿入します
プログレスバーの
ここに画像の説明を挿入します
背景スタイル
最初のステップは、bobyに
ここに画像の説明を挿入します
ナビゲーションとサイドナビゲーションの記述を開始することです。
ここに画像の説明を挿入します

ナビゲーションタブの側面を取得する方法は最初のステップ
影響
ここに画像の説明を挿入します
ます。ナビゲーションイベントを監視する必要があるため、側面ナビゲーションの一意のIDとしてlay-filterを結合する必要があります。
ここに画像の説明を挿入します
ulにはliのリスト1が含まれているため、ulを追加する必要があります。二。
ここに画像の説明を挿入します

ps(javascriptを追加:;最初にジャンプしないようにする)
ステップ2
必要なモジュールをインポートします
ここに画像の説明を挿入します

操作のテキスト情報を取得する
ここに画像の説明を挿入します
ということは、操作したいテキスト情報を取得しパラメータを追加することを意味します。そうしないと、出力されません。
3番目のステップは、データ追加
ここに画像の説明を挿入します
し、その後にジャンプしてlayidするhtml追加することです。4
番目のステップは
ここに画像の説明を挿入します
取得した値決定することです。ここに画像の説明を挿入します

evalを使用して必要な文字列を計算し
Webページの
ここに画像の説明を挿入します
長さとlayidを取得してすべてのタブ取得することを忘れないでください。IDを取得する必要があるため、layidをスプライスする必要があります。
ここに画像の説明を挿入します
競合避けるために、上記を11
ここに画像の説明を挿入します
に設定し、長さが0以下かどうかを判断して、現在のタブがないことを意味します。クリックしたリストを追加します
ここに画像の説明を挿入します

ここに画像の説明を挿入します
ここに画像の説明を挿入します

ここに画像の説明を挿入します

おすすめ

転載: blog.csdn.net/m0_46937429/article/details/109477198