【html】buttonボタンのいくつかの問題

9505 ワード

質問:


buttonボタンはtypeプロパティを設定しない場合、ブラウザによって異なります.例を挙げます.
html:
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="renderer" content="webkit"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <title>button </title>
</head>
<body>
    <form action="result.php" method="post">
        <input type="text" name="txt" placeholder=" !" autocomplete="off"/>
        <button>button </button>
    </form>
</body>
</html>

result.php:
<?php echo $_POST['txt'] ?>

ie 8以上にie 8クリックボタンを含めるとフォームを正常に提出できるが、ie 6とie 7の下ではクリックボタンが反応しないことが分かった.

理由:


どうして違いがあるの?buttonボタンにはtypeプロパティが設定されていないため、ブラウザによってbuttonを解析するtypeのタイプが異なります.
w 3 schoolでは、buttonボタンにtypeプロパティを常に指定する必要があることがわかります.Internet Explorer(ie 6とie 7とテストされた)のデフォルトタイプはbuttonであり、他のブラウザ(W 3 C仕様を含む)のデフォルト値はsubmitです.詳細はこちら .
最後にdemoを変更します.
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="renderer" content="webkit"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <title>button </title>
</head>
<body>
    <form action="result.php" method="post">
        <input type="text" name="txt" placeholder=" !" autocomplete="off"/>
        <button type="button">button type button</button>
        <button type="submit">button type submit</button>
    </form>
</body>
</html>

PS:
この文章を書く目的はbuttonを使用するときにラベルに対応するtypeタイプを指定する必要があることを注意することです.