1

その初心者も..私はユーザー名とパスワードを受け取り、それらを検証するフォームを設計しようとしています。ただし、最初に、サーブレットまたはその他のサーバー関連コンポーネントに渡す前に、ユーザーが両方のフィールドに入力していることを確認したいと思います。どちらかまたは両方のフィールドが空の場合のJOptionPaneのように、アラートボタンを生成するjavascriptを使用してこれを行いたいと思います。私のコードは


index.jsp


<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>JSP Page</title>
    <script src="newjavascript.js"></script>
</head>
<body>
    <h1>Hello World!</h1>
    <form id="form" method="post" action="final.jsp">
    Student name :<br><input type="text" value="" name="username"   id="idusername"><br><br>
    Password :<br><input type="text" value="" name="password" id="idpassword"><br><br>
    <input type="submit" value="Register" />
</form>
</body>
</html>

上記をjavascriptファイルnewjavascript.jsに渡します。


$(document).ready(function(){
var form = $("#form");
var username = $("#idusername");
    var password = $("idpassword");
//On Submitting
form.submit(function(){
    if(validateName() & validatePassword())
        return true;
    else
    {
        alert('Some fields are not filled correctly. Please fill them correctly.');
        return false;
    }
});

function validateName(){

    if(username.val().length < 1){
        return false;
    }

    else{
        return true;
    }
}

    function validatePassword(){


    if(password.val().length <5){
        return false;
    }

    else{           
        return true;
    }
}
});

私のJavaScriptコードが間違っているか、パラメータを適切に渡すことができませんか?

4

3 に答える 3

1

以下の修正を加えた、修正されたバージョンのコードのフィドルを次に示します。

  1. $( "#idpassword");を使用する必要があります。
  2. 「論理積」の比較には&&を使用する必要があります。「ビット単位のand」には&を使用しないでください。コードはビット単位の&で動作しますが、ビット単位の演算を実行しようとしているわけではありません。

添加

  1. デフォルトのフォーム送信を防ぐ必要があります。

    form.submit(function(event){... if(bad){event.preventDefault();}

(私はこれをフィドルに入れましたが、それについて言及するのを忘れました)

于 2012-06-20T16:21:21.353 に答える
1

このようにしてください

$(document).ready(function(){
var form = $("#form");
form.submit(function(){
    if(validateName() && validatePassword())
        return true;
    else
    {
        alert('Some fields are not filled correctly. Please fill them correctly.');
        return false;
    }
});

});
function validateName(){
var username = $("#idusername");

    if(username.val().length < 1){
        return false;
    }

    else{
        return true;
    }
}

    function validatePassword(){
    var password = $("#idpassword");//previously it was wrong


    if(password.val().length <5){
        return false;
    }

    else{           
        return true;
    }
}
于 2012-06-20T16:17:40.377 に答える
1
<script>
        $(document).ready(function () {
            var form = $("#form");
            alert(form);
            var username = $("#idusername");
            var password = $("#idpassword");
            //On Submitting
            form.on("submit",function () {
                if (validateName() & validatePassword())
                    return true;
                else {
                    alert('Some fields are not filled correctly. Please fill them correctly.');
                    return false;
                }
            });

            function validateName() {

                if (username.val().length < 1) {
                    return false;
                }

                else {
                    return true;
                }
            }

            function validatePassword() {
                alert(password);

                if (password.val().length < 5) {
                    return false;
                }

                else {
                    return true;
                }
            }
        });


    </script>
于 2012-06-20T16:22:04.213 に答える