HTML の隠しフィールドの紹介と例

HTML の隠しフィールドの紹介と例
基本的な構文:

<input type="hidden" name="フィールド名" value="値">

効果:

1 隠しフィールドは、ページ上のユーザーには表示されません。フォームに隠しフィールドを挿入する目的は、フォームを処理するプログラムで使用する情報を収集または送信することです。閲覧者がフォームを送信するために「送信」ボタンをクリックすると、隠しフィールドの情報もサーバーに送信されます。

2 フォームを送信するときに、セッション キーなど、ユーザーの ID を確認するための情報をユーザーに提供する必要がある場合があります。もちろん、これらのことは Cookie を使用して実現することもできますが、隠しフィールドを使用する方がはるかに簡単です。また、ブラウザがサポートしていない、またはユーザーがクッキーを無効にしているといった問題も発生しません。

3 フォームに複数の送信ボタンがある場合があります。プログラムは、ユーザーが送信するためにどのボタンを押したかをどのように判断するのでしょうか?隠しフィールドを記述し、各ボタンに onclick="document.form.command.value="xx"" を追加することができます。その後、データを受け取った後、まずコマンドの値をチェックして、ユーザーが送信するためにどのボタンを押したかを知ることができます。

4 Web ページ上に複数のフォームが存在する場合があります。複数のフォームを同時に送信できないことはわかっていますが、これらのフォームが相互に作用する場合があります。フォームに隠しフィールドを追加して、それらを接続することができます。

5 JavaScript はグローバル変数をサポートしていませんが、グローバル変数を使用しなければならない場合もあります。最初に値を隠しフィールドに格納しておけば、その値は失われません。

6 別の例としては、ボタンが押されたときに 4 つの小さなウィンドウがポップアップ表示され、そのうちの 1 つの小さなウィンドウをクリックすると、他の 3 つのウィンドウが自動的に閉じられるというものがあります。ただし、IE は小ウィンドウ同士の呼び出しをサポートしていないため、親ウィンドウにのみ隠しフィールドを書き込むことができ、小ウィンドウは隠しフィールドの値が近いことを検出すると、自身を閉じます。

例: 送信ボタンをクリックしたときに数値に 1 を追加するには、hidden を使用します。

値の自動増分.htm

コードをコピー
コードは次のとおりです。

<form action="値増分.ashx" method="post">
<input type="hidden" name="_viewstate" value="a" />
<input type="hidden" name="_div" value="@n" />
<!-- <input name="txt" type="text" value="@value" />-->
<div>@n</div>
<input type="submit" value="click" />
</フォーム>

一般的なハンドラ実装の使用

値の自動増分.ashx

コードをコピー
コードは次のとおりです。

整数n = 0;
パブリック void ProcessRequest (HttpContext コンテキスト) {
context.Response.ContentType = "text/html";

文字列パス = context.Request.MapPath("値の増分.htm");
文字列 html = System.IO.File.ReadAllText(パス);
// ページが初めて読み込まれたかどうかを確認します
文字列viewstate = context.Request.Form["_viewstate"];
if (!string.IsNullOrEmpty(viewstate))
{
//投稿ボタンをクリック
//隠しフィールドの値を取得する
文字列 s = context.Request.Form["_div"];
if (int.TryParse(s, out n))
{
n++;
html = html.Replace("@n",n.ToString());
}
}
それ以外
{
//ページが初めて読み込まれると、divとdivに対応する隠しフィールドに値が割り当てられます
html = html.Replace("@n", n.ToString());
}
コンテキスト.Response.Write(html);
}

<<:  静的ページと動的ページの実行メカニズムの説明

>>:  M1 ProチップでVueプロジェクトを開始する方法

推薦する

MyISAMとInnoDBの違いについてお話しましょう

主な違いは次のとおりです。 1. MySQL はデフォルトで MyISAM を使用します。 2. M...

MySQLはテーブルデータを復元するためにfrmファイルとibdファイルを使用します

目次frm ファイルと ibd ファイルの紹介frm ファイル回復テーブル構造ibd ファイル回復テ...

JavaScript でプロトタイプ パターンを実装する方法

概要プロトタイプ パターンは、プロトタイプ インスタンスによって作成されるオブジェクトの型を指し、こ...

要素の水平方向の中央揃えを実現する3つの方法と、固定レイアウトとフローレイアウトの概念の理解

CSS でテキストを中央揃えにするプロパティは非常に簡単に実現できます。text-align:cen...

HTMLでカスタムタグを使用する方法

カスタム タグは XML ファイルと HTML ファイルで自由に使用できますが、いくつか注意すべき点...

Linux システムの /etc/fstab ファイルの詳細な解釈

序文 [root@localhost ~]# cat /etc/fstab # #/etc/fsta...

Vueフロントエンドパッケージングの詳細なプロセス

目次1. パッケージ化コマンドを追加する2. パッケージ化されたコードを実行する3. パッケージ化し...

JavaScript プリミティブデータ型シンボルの詳細な説明

目次導入説明名前の競合私有財産要約する導入シンボル変数を作成する最も簡単な方法は、Symbol() ...

Innodb で MySQL の 2T テーブルをすばやく削除する方法の例

序文この記事は主に、MySQL の Innodb で 2T の大きなテーブルをすばやく削除する方法に...

Linux運用保守ツールSupervisor(プロセス管理ツール)のインストールと使用

1. はじめにSupervisor は Python で開発された汎用プロセス管理プログラムです。通...

MySQLで時間を判定条件として使用する方法

背景: 開発プロセスでは、現在の月、現在の日、現在の時間、今後数日など、時間を判断条件としてデータを...

Linux 圧縮ファイルコマンド zip の使用例

「.zip」形式は、Windows システムでファイルを圧縮するために使用されます。実際、「.zip...

mysql5.6.zip形式の圧縮版インストールグラフィックチュートリアル

はじめに: MySQL は、スウェーデンの MySQL AB によって開発されたリレーショナル デー...

HTMLメタの大きな役割

メタ属性には、name と http-equiv の 2 つがあります。 name 属性は主に、We...

擬似静的およびクライアント適応型 Nginx の設定方法

バックエンドは thinkphp3.2.3 フレームワークを使用します。他の言語を使用している場合は...