このビデオでは、ユーザー入力を得るための3つの追加方法について説明します。
最初のラジオボタンは、私たちが見た入力タグの実際のタイプです。
これはチェックボックスに似ています。
次のselectタグは、ドロップダウンメニューの取得方法です。
最後に、複数行のテキスト入力を作成するためのテキスト領域について説明します。
だから、私はもちろんHMOの定型文で始めるつもりです。
それを保存してタイトルを追加して、ラジオボタンを追加してみましょう。
だから、ラジオなので入力タイプだけです。
そして、私はそれを複製するつもりです。チェックボックスだけを並べて見ることができるので、他のタイプを与えるつもりです。
これはここのラジオボタンです。
私は一度それを選んだら、私はオフにすることはできません。
これはオンとオフを切り替えることができるチェックボックスです。
したがって、実際には、チェックボックスを使用してユーザーが選択できるようにするか、ユーザーが確認できる5つの選択肢があるとします。
私たちがユーザーに彼らを選ぶように求めているとしよう。
これは求人サイトであり、スキルを選択したいと考えています。
私たちは、彼らがJavaScriptを発声してHMOか多分JavaScriptだけを見ることができるようにしたい、そして彼らは私たちのラジオボタンをチェックしたり消したりするチェックボックスの束です。
しかし、通常、ユーザーが1つの選択肢を持っている場合に使用されます。
したがって、Webサイトの典型的な例は、男女やその他の女性を確認するようなジェンダーのようなものでなければなりません。
あなたは1つの選択肢しか持たない。
選択しないことは分かりません。
たとえば、猫や犬を好むかどうかをユーザーが選択するフォームを作成し、両方を選択するオプションはありません。
残念なことに、この世界では、それは黒または白のどちらかですが、私たちは犬を好む猫を好みます。
そのために、2つのラジオボタンを用意します。
そして、それが私たちが始めようとしているすべてのものなら、私は1つを選ぶことができ、もう1つは選ぶこともできます。
私たちが望むものではありません。
私は1つしか選ぶことができないようにしたい。
だから私がやってみたいことは、フォームが作成され、そのフォームに入力を移動することです。
そして今のところは、単にリクエストを取得するだけで、ページを更新するだけのデフォルトのアクションになるようにしておきます。
次のことは、ラベルをいくつか追加して、4つの構文を使用して、これが犬のためになるようにすることです。
それから、私たちは私たちの意見とIを与えなければなりません。 D. 犬。
しかし、それらはその後一致しなければならない。
同じことがここにあります。
猫とId猫の別のラベルタグ。
あなたが新鮮ならば、私たちは2つの選択肢を持っています。
しかし、私はまだ両方を選ぶことができます。
だから、私たちがする必要があるのは、これらの2つのラジオボタンが同じ選択のためにどのようになっているかを彼に伝えることです。
そうするためには、name属性を使用する必要があります。名前属性は個々の入力に名前を付けていますが、名前はそれを参照することができ、HGP要求に格納されたり、名前が重要であるということもあります。
それでここに名前をつけましょう。
最初の名前はペットの選択肢と呼んでいます。
そしてここに入力すると、まったく同じ名前を付けるつもりです。
そして、私たちがあなたに見せてくれるのは、同じ名前をつけることによって、それからそれらを結びつけることで、今私たちはただ一つを選ぶことができるということです。
だから我々はリフレッシュする場合。
私は犬や猫をクリックすることができますが、両方をクリックすることはできません。
もう一つ、私はあなたを見せます。
フォームの最後にボタンを追加しましょう。
私たちが今まで見てきたのは、実際には入力フォームがフォームの下部に提出することですが、ボタンがフォームの最後のものであれば、実際にフォームを送信することを示すためのボタンを表示します。
したがって、入力のいくつかのオプションがあります。実際に入力する最後の入力ボタンまたは入力タイプの最後のボタンでフォームを送信してください。
さあ、今度は犬を選んでみましょう。
唯一の自然選択です。
名前はペットの選択であることを覚えておいてください。他の入力と同じように、クエリー文字列に何かが表示されるはずです。
私がゴーをクリックすると、私たちはペットの選択肢が等しいかどうかを確認します。
だから私たちは、この決定の価値が何であるかを言う必要があるということを一つも欠いている。
だからあなたは先に進んで、そのvalue属性の中にvalueタグを追加します。
そして、ちょうどこの値が犬になると言うと、これは猫であり、どこから来ているのかを見ることができるようにすべての大文字にしましょう。
OK。
つまり、ユーザーがペット選択肢の名前で犬をクリックすると、ユーザーが値下げしたネコを送信したり、ペットの選択肢の名前をクリックした場合、値の犬はすべて大文字で保存されます。
だからちょうどあなたが犬をクリックしようとしていることを示すために、私たちはペットの選択肢を犬と同等にします。
私たちが猫をしたら、猫のためにペットの選択をします。
したがって、次の要素はselectタグであり、selectタグを使用すると、すばらしいドロップダウンメニューが作成されます。
したがって、タグ名が呼び出されます。
それはちょうど選択です。
開始タグと終了タグです。
私がそれをして、スライドさせて私のページをリフレッシュすると、
私は実際にはすでにドロップダウンメニューを取得しています。
それはちょうど完全に空です。
selectタグと一緒に、optionタグを使います。
したがって、そこには使用可能なすべてのオプションがあります。選択するにはオプションタグを追加します。
だから、ユーザーが自分の好きな色を選んでドロップダウンして、ここでいくつかのオプションを実行しましょう。
レッドオレンジとイエロー。
あなたが見ることができるように、私たちは既に私たちの選択肢でここに素敵なドロップを取得します。
私がヒットしたら、オレンジを選んで、私はヒットします。
あなたが実際にここに何も得られないのが分かります。私たちがこの時間に黄色い犬を選ぶと、私たちは私が好きです。
私はまだペットの選択肢しか得られません。それは、私たちが提供する名前がないからです。
だから私たちの選択で我々はそれに名前を付ける必要があり、単にそれをfavと呼んでみましょうし、ちょうど色をして、それを残してみましょう。
そして、私のページをリフレッシュして、猫をクリックさせて、黄色をクリックして、ここを見てみましょう。
私は今、ペットの選択肢を取得する猫と色は黄色です。
だから、私がこの場合イエローマップで選択したオプションに応じて、ブラウザはテキストがそのオプションの内側にあるものを取り、名前の色の値として送るだけです。
そのため、リクエストで送信される値は、ドロップダウンでユーザーに表示されるものと同じにする必要はありません。
したがって、ユーザーの気分を選択して、あなたの現在の気分は何ですか、私たちはここで幸せな顔をしたいと思うのであれば、その例があります。
私が推測する最も感情のない顔と悲しい顔。
ここで私たちの顔文字でこの素敵なドロップダウンに終わりますが、ユーザーが幸せを選択したときに、このすべてを送信したくないとしましょう。
代わりに、私たちは幸せな言葉を送ってほしい、または言葉がそれをするために送られると言いました。
valueタグを使用します。
だから我々は価値が等しいと言うでしょう。
ハッピーとニュートラル、そして値が等しく設定されているとしましょう。
今私は正しい犬をリフレッシュして外に出ようとすると、私は行くをクリックします。
私はペットの選択肢を得ることがわかります犬と色は同じです。
もちろん、その名前は、マークアップが意味を持ち、実際には意味をなされるように気分に変えたいと思う色として名前を保持していたからです。
だから猫はとても幸せですが、気分は幸せと同じです。
OK。
それだけで、私たちは選択肢でカバーする必要があります。
もう一つのことは、textareaタグとtextareaです。
私はそれをインドに置くでしょうが、複数の行である入力を作成する良い方法です。
したがって、この入力タイプのようなテキスト入力はテキストと等しく、単一行です。
しかし、ユーザーにバイオの質問をしたり、非常にうまくいかない履歴書やコピーを貼り付けたり、このスリムな短い入力をしたい場合はどうでしょうか？
ですから、実際にはselectのような別のタグです。
したがって、タイプの入力ではありません。
これは実際にフォームコントロールの別のタイプです。
そして、それが働く方法は2つの重要な部分があります。
最初に、テキストエリアタグを作成し、それ自体でこのテキストエリアを提供します。
しかし、私たちができるのは、テキスト領域がこれらの2つの属性の行と列を使っている正確な大きさを指定することです。
だから私はここにそれを見せます。
10行50列から始めましょう。私のテキストエリアは両方向に展開されています。
しかし、それは間違いなく広くなった。
だから今私は100行を望んでいるとしましょう、あなたはそれがもっと長くなることがわかります。
基本的には、テキスト領域のサイズを変更する行数と列数を指定できます。
それについてのもう1つのことは、これらの他の要素と同じように、小さなものから10まで10に戻ってみましょう。
これらの要素と同様に、リクエストでこのデータを送信したい場合は、この入力を取り除きましょう。
私はそれに名前を付ける必要があります名前は等しいと、単に段落をいくつかのテキストでこの段落を記入してみましょう。
私はgoをクリックして、これを見るか、または展開することができます。
私は段落を取得するすべてのテキストここにすべての移動