10

登録ページを書こうとしているのですが、一番苦労しています。

<form  action="insert.php" method="post">
    <h1>Registration:</h1>
    <input type="text" name="first" placeholder="First name">
    <input type="text" name="last" placeholder="Last name"><br />
    <input type="text" name="username" placeholder="Username"> <br />
    <input type="password" name="password" placeholder="password"> <br />
    <input type="password" name="confirmPass" placeholder="Confirm Password"> <br />
    <input type="submit" value="Register">
</form>

これは、登録ページにある私のコードです。JavaScript 関数を呼び出して、引き続き投稿してアクションを実行するにはどうすればよいですか? これを別の単純なモジュールとして作成しましたが、それらをマージしたいと思います

<input id="pass1" type="password" placeholder="Password" style="border-radius:7px; border:2px solid #dadada;" /> <br />
<input id="pass2" type="password" placeholder="Confirm Password" style="border-radius:7px; border:2px solid #dadada;"/> <br />

<script>
    function myFunction() {
        var pass1 = document.getElementById("pass1").value;
        var pass2 = document.getElementById("pass2").value;
        if (pass1 != pass2) {
            //alert("Passwords Do not match");
            document.getElementById("pass1").style.borderColor = "#E34234";
            document.getElementById("pass2").style.borderColor = "#E34234";
        }
        else {
            alert("Passwords Match!!!");
        }
    }
</script>

<button type="button" onclick="myFunction()">Sumbit</button>

それらをマージするのに助けは必要ありません。いくつかのものを切り替える必要があることはわかっていますが、それらが一緒になっている場合、JavaScript 関数をどのように呼び出すのですか?

何をすべきかを理解した後、これはよりきちんと行われます.JavaScript関数を呼び出す最良の方法は何でしょうか.それが成功した場合は、フォームの投稿とアクション部分に進みます. 送信ボタンを捨てて、JavaScript 関数を呼び出すボタン タイプを実行することもできますが、それが機能するかどうかはどうなるでしょうか? 私は本質的に（この時点で）パスワードが同じであることを確認したいと考えています。そうでない場合はinsert.phpに進みませんが、一致する場合はフォームデータをinsert.phpに渡します

4

3 に答える 3

27

onsubmitフォームにイベント ハンドラーを追加するだけです。

<form  action="insert.php" onsubmit="return myFunction()" method="post">

onclickから外して型buttonで作るinputsubmit

<input type="submit" value="Submit">

関数にブール値の return ステートメントを追加します。

function myFunction() {
    var pass1 = document.getElementById("pass1").value;
    var pass2 = document.getElementById("pass2").value;
    var ok = true;
    if (pass1 != pass2) {
        //alert("Passwords Do not match");
        document.getElementById("pass1").style.borderColor = "#E34234";
        document.getElementById("pass2").style.borderColor = "#E34234";
        return false;
    }
    else {
        alert("Passwords Match!!!");
    }
    return ok;
}
于 2013-06-07T18:12:32.500 に答える
3 
 if ($("#Password").val() != $("#ConfirmPassword").val()) {
          alert("Passwords do not match.");
      }

不要なコードを排除する JQuery アプローチ。

于 2015-02-25T15:06:16.390 に答える