From fd1e2435671adf89d5a2718fc7d1454828f147ae Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Mon, 12 Jul 2021 10:11:30 +0900 Subject: remove wiki.developer.mozilla.org links --- files/ja/learn/forms/your_first_form/index.html | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) (limited to 'files/ja/learn/forms/your_first_form/index.html') diff --git a/files/ja/learn/forms/your_first_form/index.html b/files/ja/learn/forms/your_first_form/index.html index d3e646269f..eb4e028208 100644 --- a/files/ja/learn/forms/your_first_form/index.html +++ b/files/ja/learn/forms/your_first_form/index.html @@ -38,7 +38,7 @@ translation_of: Learn/Forms/Your_first_form

ウェブフォームとは何か?

-

ウェブフォームとは、ユーザーと ウェブサイトやアプリケーションとの対話の要となるもののひとつです。フォームによって、ユーザーは ウェブサイトへデータを送ることができます。それらのデータはたいてい ウェブサーバーに送られて処理、保存されたり (モジュール後半のサーバーにデータを送るを見てください) 、クライアント側ですぐにインターフェイスを更新する(例えば、リストに他の項目を追加したり、UI の機能を表示/非表示にしたり)こともあります。

+

ウェブフォームとは、ユーザーと ウェブサイトやアプリケーションとの対話の要となるもののひとつです。フォームによって、ユーザーは ウェブサイトへデータを送ることができます。それらのデータはたいてい ウェブサーバーに送られて処理、保存されたり (モジュール後半のサーバーにデータを送るを見てください) 、クライアント側ですぐにインターフェイスを更新する(例えば、リストに他の項目を追加したり、UI の機能を表示/非表示にしたり)こともあります。

ウェブフォームは 1 つ以上のフォームコントロール(ウィジェットともいいます)と、フォーム全体を構成するのに役立つ追加要素 — よく HTML フォームと呼ばれます — とで作られます。それらのコントロールはテキストフィールド (単一行または複数行)、ドロップダウンボックス、ボタン、チェックボックスあるいはラジオボタンがあります。たいていは {{htmlelement("input")}} 要素を使って作成されますが、その他の要素もあります。

@@ -75,7 +75,7 @@ translation_of: Learn/Forms/Your_first_form </form> -

これは、フォームを正式に定義します。これは {{HTMLElement("div")}} 要素や {{HTMLElement("p")}} 要素と同様にコンテナ要素ですが、フォームの動作を設定するための固有の属性もサポートします。すべての属性は省略可能ですが、少なくとも action 属性と method属性は常に設定することがベストプラクティスであると考えられます。

+

これは、フォームを正式に定義します。これは {{HTMLElement("div")}} 要素や {{HTMLElement("p")}} 要素と同様にコンテナ要素ですが、フォームの動作を設定するための固有の属性もサポートします。すべての属性は省略可能ですが、少なくとも action 属性と method属性は常に設定することがベストプラクティスであると考えられます。

-

大事なことを言い忘れましたが、<input> と <textarea></textarea> の構文に注意してください。これは HTML の変わったことの 1 つです。<input> タグは空要素です。つまり、終了タグは不要です。一方 {{HTMLElement("textarea")}} は空の要素ではないので、適切な終了タグで閉じる必要があります。これは HTML フォームの特定の機能、つまりデフォルト値の定義方法に影響があります。{{HTMLElement("input")}} 要素のデフォルト値を定義するには、次のように value 属性を使う必要があります。

+

大事なことを言い忘れましたが、<input> と <textarea></textarea> の構文に注意してください。これは HTML の変わったことの 1 つです。<input> タグは空要素です。つまり、終了タグは不要です。一方 {{HTMLElement("textarea")}} は空の要素ではないので、適切な終了タグで閉じる必要があります。これは HTML フォームの特定の機能、つまりデフォルト値の定義方法に影響があります。{{HTMLElement("input")}} 要素のデフォルト値を定義するには、次のように value 属性を使う必要があります。

<input type="text" value="デフォルトではこの要素にはこの文章が挿入されます" />
@@ -251,9 +251,9 @@ button {

データをウェブサーバーに送信する

-

最後の、またもっともややこしいであろう部分が、サーバー側でのフォームデータの扱いです。{{HTMLElement("form")}} 要素は  action 属性と method 属性により、どこへどのようにデータを送信するかを定義できます。

+

最後の、またもっともややこしいであろう部分が、サーバー側でのフォームデータの扱いです。{{HTMLElement("form")}} 要素は  action 属性と method 属性により、どこへどのようにデータを送信するかを定義できます。

-

フォームコントロールに name をつけます。これらの名前はクライアント側とサーバー側の両側で重要です。ブラウザー側ではそれぞれのデータにどのような名前をつけるかを示すものであり、サーバー側では名前によってそれぞれのデータを扱うことができます。フォームデータは名前/値のペアとしてサーバーに送信されます。

+

フォームコントロールに name をつけます。これらの名前はクライアント側とサーバー側の両側で重要です。ブラウザー側ではそれぞれのデータにどのような名前をつけるかを示すものであり、サーバー側では名前によってそれぞれのデータを扱うことができます。フォームデータは名前/値のペアとしてサーバーに送信されます。

データに名前をつけるために、各々のデータを集めるフォームウィジェットの name 属性を使用しなければなりません。ここでもフォームのコードで見てみましょう:

@@ -295,11 +295,11 @@ button {
  • 初めてのフォーム
  • フォームの構築方法
  • ネイティブフォームウィジェット
    • -
  • The HTML5 input types
    • -
  • Other form controls
    • +
  • The HTML5 input types
    • +
  • Other form controls
  • フォームへのスタイル設定
  • フォームへの高度なスタイル設定
    • -
  • UI pseudo-classes
    • +
  • UI pseudo-classes
  • フォームデータの検証
  • フォームデータの送信
    • @@ -307,7 +307,7 @@ button {

    上級トピック

    -- cgit v1.2.3-54-g00ecf