HTMLタグ<button>の使用法-htmlチュートリアル-php.cn

HTMLタグ

巴扎黑

リリース： 2017-06-16 14:08:00

オリジナル

2792 人が閲覧しました

Webページでは、ボタンは通常のボタン、送信ボタン、リセットボタンの3種類に分けられます。

1. 通常のボタンボタン

通常、フォームを実装するには、JavaScript スクリプトと組み合わせる必要があります。

構文:

<input type="button" value="普通按钮的取值" onclick="JavaScript脚本程序"/>

ログイン後にコピー

説明:

value の値はボタンに表示されるテキスト、onclick は通常のボタンのイベントです。これについては JavaScript 入門チュートリアルで詳しく説明しますので、理解できると思います。ここ。

例:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    单击按钮弹出对话框：<br/>
    <input type="button" value="按钮" onclick="alert(&#39;你点击了按钮！&#39;)">
</body>
</html>

ログイン後にコピー

2. 送信ボタン submit

送信ボタンをクリックすると、フォームの内容をサーバーに送信して処理することができます。

構文:

<input type="submit" value="提交按钮的取值"/>

ログイン後にコピー

説明:

value の値は、ボタンに表示されるテキストです。例については、「リセットボタン」の例を参照してください。

送信ボタンの本当の有用性は、バックエンド技術を学ぶまで真に理解することはできません。

3. リセットボタンリセット

リセットボタンをクリックすると、ページフォームにユーザーが入力した情報をクリアできます。

構文:

<input type="reset" value="重置按钮的取值"/>

ログイン後にコピー

説明:

value の値は、ボタンに表示されるテキストです。

例:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <form name="form1" method="post" action="index.html">
        账号：<input type="text"/><br/>
        密码：<input type="text"/><br/>
        <input type="submit" value="提交"/>
        <input type="reset" value="重置"/>
    </form>
</body>
</html>

ログイン後にコピー

テキストボックスに文字を入力してリセットボタンを押すと、テキストボックスの内容が消去されます。これがリセットボタンの働きです。

1. リセットボタンの誤解

上記から、リセットボタンはユーザーがフォームに入力した情報をクリアできることがわかりますが、リセットボタンは「現在のフォーム」のフォーム要素の内容しかクリアできません。 form タグの外側の form 要素は無効です。

例:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <form name="form1" method="post" action="index.html">
        账号：<input type="text"/><br/>
        密码：<input type="text"/><br/>
        <input type="submit" value="提交"/>
        <input type="reset" value="重置"/>
    </form>
    昵称：<input type="text"/><br/>
</body>
</html>

ログイン後にコピー

その後、

タグの外側のテキストボックス、つまりニックネームのテキストボックスに情報を入力してリセットボタンを押すと、無効であることがわかります。

結論: リセットボタンは、現在のタグ内のフォーム要素の入力情報のみをクリアでき、現在のタグの外側のフォーム要素には影響しません。

ここで言及しておきますが、送信ボタンは現在のタグにも使用されます。

4. 通常のボタン、送信ボタン、リセットボタンの違い

上記のことから、通常のボタンは通常、特殊な効果を実現するために JavaScript スクリプトと組み合わせられ、送信ボタンは主に現在の < ボタンを変換するために使用されます。 form> タグ内フォーム入力情報は処理のためにサーバーに送信され、リセットボタンは現在タグ内にあるフォーム要素の入力情報をクリアします。

HTMLの入門段階では、これら3つのボタンの機能を完全に理解することは不可能です。パニックになる必要はありません。よく理解していなくても問題ありません。これには JavaScript と動的 Web ページが含まれるためです。後のコースを学習すれば明確に理解できるようになります。 HTMLの段階では、どのような種類のボタンがあるのか、ラベルのコードをどのように記述するのかだけを知る必要があります。非常に簡単です。

以上がHTMLタグ

HTMLタグの使用法

HTMLタグ