HTML フォームに関する包括的な知識

8.1 フォームタグff9c23ada1bcecdd1a0fb5d5a0f18437

a3a1046b82a2f1c40ac748c8599351e2......f5a47148e367a6035fd7a2faa965022e

☟ フォーム属性:

◆ action: フォームを指定するために使用されるサーバー プログラム。フォームが送信されたときにフォーム データの送信先を指定します。 action の値は次のとおりです。まず、URL (絶対 URL/相対 URL) で、通常はサーバー側のプログラムを指します。プログラムはフォームによって送信されたデータ (つまり、フォーム要素の値) を受け取り、それに応じて処理します。 。例:

ユーザーがこのフォームを送信すると、サーバーは「reg.ashx」という名前の汎用ハンドラーを実行します。次に、mailto プロトコルの URL アドレスを使用します。これにより、フォームのコンテンツが電子メールとして送信されます。訪問者のコンピュータに電子メール送信プログラムがインストールされ、適切に設定されている必要があるため、この状況は比較的まれです。 3 番目は、null 値です。アクションが null であるか、書き込まれていない場合、それは現在のページに送信されることを意味します。

◆ method: この属性は、ブラウザがフォーム内のデータをサーバー ハンドラーに送信する方法を定義します。最も一般的に使用されるのは get と post で、デフォルトでは get メソッドが使用されます。

取得と投稿の違いは何ですか?

① データクエリ: たとえば、フォーラムを閲覧するとき、URL には通常、カテゴリ、ページ番号、ページごとのレコード数などの情報が含まれます。 getメソッドを使えば、問い合わせたい情報（条件）が一目でわかります。 post ではこの情報が隠蔽されるため、クエリ条件を確認するのに不便です。

② 機密データの提出（セキュリティ）：ユーザーの登録、ユーザー情報の変更などの記録の変更または追加を行う場合。 URL に追加された get メソッドにより機密情報が漏洩する可能性があります。 post メソッドでは機密情報が隠蔽される可能性があります。

デモ:

get メソッドを使用して送信をクリックすると、URL は次のようになります: php Chinese website/ashx/login.ashx?login_username=admin&login_pswd=123456

post メソッドを使用して送信をクリックすると、URL は次のようになります: php Chinese website/ashx /login.ashx ☜アクションで指定したURLのみであり、URLにパラメータが付加されていないことがわかります。

③ ビッグデータテキスト配信：クエリにはgetが便利ですが、URLに添付されるため、各ブラウザにもURLの長さ制限があります。 IE: 2048 文字。 ChromeとFFでは8182文字あるようです。 Postにはそのような制限はないようです。

◆ onsubmit: フォームを処理するためのスクリプト関数を指定するために使用されます。

◆ enctype: MIME タイプを設定します。デフォルト値は application/x-www-form-urlencoded です。ファイルをサーバーにアップロードする必要がある場合は、この属性を multipart/form-data に設定する必要があります

8.2 入力タグ af76403cd29ccecd76aa38a434058e8f

8.1 选择列表：一次可以选择多个列表选项，且一次可以显示1个以上列表选项的选择列表

select 标记用于声明选择列表，option标记用于设置各个选项

<select name="列表名称" size="显示的选项数目(默认为1)" multiple="multiple"><!-- multiple设置列表中的项目可多选 -->
<option value="banana" selected="selected">香蕉</option><!-- selected设置默认选项，可设置多个 -->
<option value="apple">苹果</option>
<option value="watermelon" selected="selected">西瓜</option>
<option value="grape" selected="selected">葡萄</option>
</select>

8.2 下拉列表：一次只能选择一个列表选项，且一次只能显示一个列表选项的选择列表，即size默认1不能设置 size和 multiple属性

<select name="area">
<optgroup label="国外"> <!-- <optgroup> 标签用于组合选项，即给选项分组类别,属性为label,指定选项组合名称 -->
<option value="1">华盛顿</option>
<option value="2">旧金山</option>
</optgroup>
<optgroup label="国内">
<option value="3">广州</option>
<option value="4">湛江</option>
</optgroup>
</select>

(9)文本域标记4750256ae76b6b9d804861d8f69e79d3

一般用于给用户填写备注信息或留言信息的多行多列文本区域

<textarea name="文本区域名称" rows="行数" cols="字符数">
...(此处输入的为默认文本，比如)请在此处输入备注信息
</textarea>

(10)2e1cf0710519d5598b1f0f14c36ba674 标签:为 input 元素定义标注（标记）

label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。

注意："for" 属性可把 label 绑定到另外一个元素。请把 "for" 属性的值设置为相关元素的 id 属性的值。即为下面说的隐式的联系。

隐式和显式的联系：

标记通常以下面两种方式中的一种来和表单控件相联系：将表单控件作为标记标签的内容，这样的就是隐式形式，或者为 2e1cf0710519d5598b1f0f14c36ba674 标签下的 for 属性命名一个目标表单 id，这样就是显式形式。

显式的联系：

<label for="SSN">Social Security Number:</label>
<input type="text" name="SocSecNum" id="SSN" />

隐式的联系：

<label>Date of Birth: <input type="text" name="DofB" /></label>

(11)fieldset 标签：把表单中元素组合起来，通俗的讲就是把表单围起来，顺便给个标题注释，看起来更规整。

基本语法：2b5469ab79cf842344327415c3b3bb95 e911751791aa3ba95dc724e2fb905976...a814477f903c8e27bd1ff8e5c6bbe7c1 ff9c23ada1bcecdd1a0fb5d5a0f18437...f5a47148e367a6035fd7a2faa965022e a3ae74428855f48d0438405a4619fe75

demo：

<fieldset>
<legend>我最喜爱的:</legend>
<label for="computer">计算机</label> <input type="checkbox" value="1" id="fav" name="fav" />
<label for="trval">旅游</label> <input type="checkbox" value="2" id="fav" name="fav" />
<label for="buy">购物</label> <input type="checkbox" value="3" id="fav" name="fav" />
</fieldset>

以上がHTML フォームに関する包括的な知識の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。