コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > 本文

HTMLシリーズ(9)：form_html/css_WEB-ITnose

WBOY
リリース： 2016-06-24 11:25:00
オリジナル
893 人が閲覧しました

1. form タグ form

form タグは、フォームを宣言し、データ収集の範囲を定義するために使用されます。つまり、

に含まれるデータは、次の URL を含めてデータベースに送信されます。フォームデータの処理に使用される CGI プログラムと、データをサーバーに送信するメソッド。

フォームには、テキストフィールド、チェックボックス、ラジオボタン、送信ボタンなどの入力要素を含めることができます。メニュー、テキストエリア、フィールドセット、凡例、ラベル要素を含めることもできます。

3 つの重要な属性の説明:

1. action はフォーム送信時に操作を受け付けるアドレスを指定します

2. Method はフォームデータの送信方法を指定します。オプションの値: get、post。 get が送信されると、フォーム内のデータが URL に追加されて送信されます (非推奨)。 post は HTTP リクエストで送信されます。

3. enctype は、サーバーに送信する前にフォーム データをエンコードする方法を指定します。特に注意すべき点は、アップロード ドメインが含まれる場合、エンコード方法は enctype="multipart/form-data" に設定され、それ以外の場合はバックグラウンドに設定される必要があります。ブラウザから送信された情報を取得できません。設定フォームのMIMEエンコードです。デフォルトでは、このエンコード形式は application/x-www-form-urlencoded であり、ファイルのアップロードには使用できません。multipart/form-data が使用される場合にのみ、フォームの入力値はバイナリで渡されます。そうすることでのみ、ファイル データを完全に転送できます。 FTP 経由で大きなファイルをアップロードする場合、バイナリ モードでアップロードするオプションもあります。

enctype 3 つのオプション値 説明
application/x-www-form-urlencoded 送信前にすべての文字をエンコードする (デフォルトのエンコード)
multipart/form-data MIMEエンコーディング。データはバイナリ形式で送信されます。フォームにアップロード フィールドが含まれる場合、アップロードされたファイルを取得するためにバックグラウンドを使用する必要があります。
text/plain プレーンテキストとして送信

2. input タグ

タグはユーザー情報を収集するために使用されます。入力フィールドは、type 属性の値に応じてさまざまな形式を取ることができます。入力フィールドには、テキスト フィールド、チェックボックス、マスクされたテキスト コントロール、ラジオ ボタン、ボタンなどがあります。

1. テキストフィールド 

<input type="text" name="控件名称" size="控件长度" maxlength="填写最长字符数" value="文字字段默认值" />
ログイン後にコピー

2. パスワードフィールド

パスワードはテキストボックスと似ていますが、入力された内容はドットで表示されます。 

<input type="password" name="控件名称" size="控件长度" maxlength="填写最长字符数" value="文字字段默认值" />
ログイン後にコピー

3. ラジオ ボタン 

<input type="radio" name="单选按钮名称" value="单选按钮的取值" checked="checked" /><br />
ログイン後にコピー
男人:<input type="radio" name="sex" value="male" /><br />女人：<input type="radio" name="sex" value="female" />
ログイン後にコピー

チェックされた属性は、項目がデフォルトで選択されていることを示します。

4. チェックボックス 

<input type="checkbox" name="复选框的名称" value="复选框的值" checked="checked"/>
ログイン後にコピー

5. 通常のボタン 

<input type="button" name="按钮名" value="按钮上面的文字" onclick="处理程序"/>
ログイン後にコピー

6. リセットボタン

リセットボタンをクリックすると、リセットボタンが配置されているフォームが完全に消去され、他のフォームが消去されます。影響を受けないこと。 

<input type="reset" name="按钮名" value="按钮上面的文字" />
ログイン後にコピー

7. 送信ボタン

送信ボタンをクリックすると、ブラウザが自動的にフォームを送信します。 

<input type="submit" name="按钮名" value="按钮上面的文字" />
ログイン後にコピー

8. 隠しフィールド

隠しフィールドは、重要度の低い情報を保存するためにのみ存在します。ユーザーがフォームを送信すると、隠しフィールドの内容も一緒に送信されます。 

<input type="hidden" name="隐藏域名称" value="提交的值" />
ログイン後にコピー

9. ファイルフィールド

ファイルフィールドは、ハードディスク内のファイルパスを検索し、フォームから選択したファイルをアップロードするためによく使用されます。このコントロールは、電子メールの送信、アバターのアップロード、ファイルの転送時に表示されます。 

<input type="file" name="文件域的名称" />
ログイン後にコピー

10. 画像ボタン

Web ページの美しさを向上させるために画像をボタンとして使用したい場合は、画像フィールドを使用して画像送信ボタンを作成できます。 

<input type="image" src="图像地址" name="图像域名称" />
ログイン後にコピー

3. ドロップダウン リストの選択

select 要素は、単一選択メニューまたは複数選択メニューを作成できます。