HTML5 フォーム要素
HTML5 には次の新しいフォーム要素があります:
<datalist>
<keygen>
<output>
注: すべてではありませんブラウザは HTML5 をサポートします 新しいフォーム要素ただし、ブラウザがフォーム属性をサポートしていない場合でも使用でき、通常のフォーム要素として表示できます。
HTML5 <datalist> 要素
<datalist> 要素は、入力フィールドのオプションのリストを指定します。
<datalist> 属性は、フォームまたは入力フィールドにオートコンプリート機能が必要であることを指定します。ユーザーがオートコンプリート フィールドに入力を開始すると、ブラウザはそのフィールドに入力されたオプションを表示する必要があります。
要素の list 属性を使用して <datalist> 要素をバインドします。 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<form action="demo-form.php" method="get">
<input list="browsers" name="browser">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
<input type="submit">
</form>
<p><strong>注意:</strong> Internet Explorer 9（更早IE版本），Safari不支持 datalist 标签。</p>
</body>
</html>
インスタンスの実行»[インスタンスの実行] ボタンをクリックしてオンライン インスタンスを表示します
HTML5
<keygen> 要素の役割は、信頼できるメソッドを提供することです。ユーザーを認証します。
<keygen> タグは、フォームで使用されるキー ペア ジェネレーター フィールドを指定します。
フォームが送信されると、2 つのキーが生成されます。1 つは秘密キー、もう 1 つは公開キーです。
秘密鍵はクライアントに保存され、公開鍵はサーバーに送信されます。公開キーは、後でユーザーのクライアント証明書を検証するために使用できます。
例<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<form action="demo_keygen.php" method="get">
用户名: <input type="text" name="usr_name">
加密: <keygen name="security">
<input type="submit">
</form>
<p><strong>注意:</strong> Internet Explorer 不支持 keygen 标签。</p>
</body>
</html>
サンプルを実行する»オンラインサンプルを表示するには、「サンプルを実行」ボタンをクリックしてください
HTML5の<output>要素
<output>計算やスクリプト出力などの出力:
インスタンス<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" value="50">100
+<input type="number" id="b" value="50">
=<output name="x" for="a b"></output>
</form>
<p><strong>注意:</strong> Internet Explorer 不支持 output 标签。</p>
</body>
</html>
インスタンスの実行»「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します
HTML5の新しいフォーム要素
| 説明 | |
|---|---|
| <input> タグはオプションのリストを定義します。この要素を入力要素と組み合わせて使用して、入力の可能な値を定義します。 | |
| ><keygen> タグは、フォームに使用するキー ペア ジェネレーター フィールドを指定します。 | |
| <output> タグは、スクリプトの出力など、さまざまなタイプの出力を定義します。 |
