ホームページ ウェブフロントエンド ライユイのチュートリアル Lauiuiのデータテーブルにクリックイベントを追加する方法

Lauiuiのデータテーブルにクリックイベントを追加する方法

Jul 11, 2019 pm 04:28 PM
layui シート

Lauiuiのデータテーブルにクリックイベントを追加する方法

最初のステップは、以下に示すように、コンピューター上でソフトウェアを開き、新しい html を作成し、layui の js ファイルと css ファイルを追加することです。

##2 番目のステップでは、新しい HTML ファイルを開き、次の図に示すように、layui.css ファイルとlayui.js ファイルを

タグ内に導入します。 Lauiuiのデータテーブルにクリックイベントを追加する方法

関連する推奨事項: 「

layui Framework チュートリアル

Lauiuiのデータテーブルにクリックイベントを追加する方法

3 番目のステップでは、本文ページのコンテンツの記述を開始します。ここで示されるテーブルの内容は次の表です。以下の図に示す、layui のサンプル データ :

4 番目のステップは、テーブル データにクリック イベントを追加することです。table.on('tool(demoEvent) '、次の図に示すように、function(obj){} でセルのイベントをリッスンし、layer.prompt() ポップアップ ボックスで obj.update({ signed: value }); を使用してテーブルとキャッシュを更新します。 :

Lauiuiのデータテーブルにクリックイベントを追加する方法

5 番目のステップでは、ブラウザで HTML ページを開くと、次の図に示すように、テーブル データの内容が表示されます。

Lauiuiのデータテーブルにクリックイベントを追加する方法

6 番目のステップは、テーブル データ コンテンツをクリックすることです。ポップアップ ボックスにユニットが表示されます。グリッド内のデータについては、クリック イベントが発生していることがわかります。以下の図に示すように、layui を通じてテーブル データに追加されます。

以上がLauiuiのデータテーブルにクリックイベントを追加する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

PPT テーブルに挿入される画像の形式を調整する手順 PPT テーブルに挿入される画像の形式を調整する手順 Mar 26, 2024 pm 04:16 PM

1. 新しい PPT ファイルを作成し、例として [PPT Tips] という名前を付けます。 2. [PPT Tips]をダブルクリックしてPPTファイルを開きます。 3. 例として 2 行 2 列の表を挿入します。 4. 表の境界線をダブルクリックすると、上部ツールバーに[デザイン]オプションが表示されます。 5. [シェーディング]オプションをクリックし、[画像]をクリックします。 6. [画像]をクリックすると、画像を背景にした塗りつぶしオプションダイアログボックスが表示されます。 7. ディレクトリ内で挿入したいトレイを見つけ、「OK」をクリックして画像を挿入します。 8. テーブル ボックスを右クリックして、設定ダイアログ ボックスを表示します。 9. [セルの書式設定]をクリックし、[画像を網掛けとして並べる]にチェックを入れます。 10. [中央]、[ミラー]など必要な機能を設定し、[OK]をクリックします。注: デフォルトでは、表に画像が入力されます。

条件に応じて色を自動変更するWPS値の設定方法_条件に応じて色を自動変更するWPSテーブル値の設定手順 条件に応じて色を自動変更するWPS値の設定方法_条件に応じて色を自動変更するWPSテーブル値の設定手順 Mar 27, 2024 pm 07:30 PM

1. ワークシートを開き、[スタート]-[条件付き書式]ボタンを見つけます。 2. [列の選択] をクリックし、条件付き書式を追加する列を選択します。 3. [条件付き書式]ボタンをクリックするとオプションメニューが表示されます。 4. [条件付きルールを強調表示]-[間]を選択します。 5. ルールを入力します: 20、24、濃い緑色のテキストと濃い塗りつぶし。 6. 確認後、選択した列のデータは、設定に従って対応する数値、テキスト、セル ボックスで色付けされます。 7. 競合のない条件付きルールは繰り返し追加できますが、競合するルールの場合、WPS は以前に確立された条件付きルールを最後に追加したルールに置き換えます。 8. [Between] ルール 20 ~ 24 と [Less than] 20 の後にセル列を繰り返し追加します。 9. ルールを変更する必要がある場合は、ルールをクリアしてからルールをリセットします。

Lauiuiログインページでジャンプを設定する方法 Lauiuiログインページでジャンプを設定する方法 Apr 04, 2024 am 03:12 AM

Layui ログインページジャンプ設定手順: ジャンプコードの追加: ログインフォーム送信ボタンクリックイベントに判定を追加し、ログイン成功後、window.location.href 経由で指定ページにジャンプします。フォーム構成を変更します。lay-filter="login" のフォーム要素に非表示の入力フィールドを追加します。名前は「redirect」、値はターゲット ページ アドレスです。

Lauiuiでフォームデータを取得する方法 Lauiuiでフォームデータを取得する方法 Apr 04, 2024 am 03:39 AM

layui は、フォームのすべてのフィールド データを直接取得する、単一のフォーム要素の値を取得する、formAPI.getVal() メソッドを使用して指定されたフィールド値を取得する、フォーム データをシリアル化するなど、フォーム データを取得するためのさまざまなメソッドを提供します。これを AJAX リクエスト パラメータとして使用し、フォーム送信イベントをリッスンしてデータを取得します。

Wordの表を合計する方法を知っていますか? Wordの表を合計する方法を知っていますか? Mar 21, 2024 pm 01:10 PM

Word の表で数を数えるという問題に遭遇することがあります。通常、このような問題に遭遇すると、ほとんどの生徒は Word の表を Excel にコピーして計算しますが、黙って電卓を手に取る生徒もいます。簡単に計算する方法はありますか?もちろんありますが、実はWordでも合計額を計算することができます。それで、その方法を知っていますか?今日は、一緒に見ていきましょう!困っている友達はすぐに集めてください。手順の詳細: 1. まず、コンピューターで Word ソフトウェアを開き、処理する必要がある文書を開きます。 (図のように) 2. 次に、(図のように) 合計値が配置されているセルにカーソルを置き、[メニュー バー] をクリックします。

初心者がフォームを作成するためのヒントは何ですか? 初心者がフォームを作成するためのヒントは何ですか? Mar 21, 2024 am 09:11 AM

私たちは Excel で表を作成したり編集したりすることがよくありますが、ソフトウェアに触れたばかりの初心者にとって、Excel を使用して表を作成する方法は私たちほど簡単ではありません。以下では、初心者、つまり初心者がマスターする必要があるテーブル作成のいくつかの手順について演習を行います。初心者向けのサンプルフォームを以下に示します。入力方法を見てみましょう。 1. Excel ドキュメントを新規作成するには 2 つの方法があります。 [デスクトップ]-[新規作成]-[xls]ファイル上の何もない場所でマウスを右クリックします。 [スタート]-[すべてのプログラム]-[Microsoft Office]-[Microsoft Excel 20**] を実行することもできます。 2. 新しい ex ファイルをダブルクリックします。

Lauiui が自己適応を実現する方法 Lauiui が自己適応を実現する方法 Apr 26, 2024 am 03:00 AM

アダプティブ レイアウトは、layui フレームワークのレスポンシブ レイアウト機能を使用して実現できます。手順には以下が含まれます:layui フレームワークを参照する。アダプティブ レイアウト コンテナを定義し、layui-container クラスを設定します。レスポンシブ ブレークポイント (xs/sm/md/lg) を使用して、特定のブレークポイントの下にある要素を非表示にします。グリッド システム (layui-col-) を使用して要素の幅を指定します。オフセット (layui-offset-) によって間隔を作成します。応答性の高いユーティリティ (layui-invisible/show/block/inline) を使用して、要素の可視性とその表示方法を制御します。

Lauiuiでデータを転送する方法 Lauiuiでデータを転送する方法 Apr 26, 2024 am 03:39 AM

layui を使用してデータを送信する方法は次のとおりです。 Ajax を使用する: リクエスト オブジェクトを作成し、リクエスト パラメーター (URL、メソッド、データ) を設定し、レスポンスを処理します。組み込みメソッドを使用する: $.post、$.get、$.postJSON、$.getJSON などの組み込みメソッドを使用してデータ転送を簡素化します。

See all articles