2

そのため、フォームを検証しようとしていますが、検証が失敗したときにテキストボックスの変更を取得できません。代わりに、フォームが完成します。私が望むのは、検証が失敗した場合、テキストボックスの境界線が赤色になり、テキストボックスのすぐ下に「このフィールドに入力してください!」というテキストが赤色で表示されることです。

これはテスト目的で書いたもので、機能していません。関連するボックスの直後に赤=色付きのテキストを追加する方法がわかりません。

<form id="reg" method="POST" action="user.php" onsubmit="return validate()">

    <label for="first">First Name: </label>
    <input id="first" name="first" type="text" value="">

    <button type="submit">Register</button>
</form> 


function validate(){
    var formIsValid = true;

    if(first.value === ""){
        //Not sure how to add Red-Colored Text below the box which says "Fill our this field!"
        first.borderColor = "red"; //NOT WORKING
        formIsValid = false;    
    }

    return formIsValid;

}
4

2 に答える 2

5

私はこれがあなたが探しているものだと信じています、

http://jsfiddle.net/F8H7Y/

<form name= "reg" id="reg" method="POST" action="user.php" onsubmit="return validate()">

    <label for="first">First Name: </label>
    <input id="first" name="first" type="text" value="">

    <input type="submit">Register</button>
</form> 



function validate(){
    var formIsValid = true;
    var first=document.forms["reg"]["first"];
    if(first.value == null || first.value == ""){
        first.style.borderColor = "red";
        formIsValid = false;    
    }

    return formIsValid;

}
于 2013-11-09T19:16:47.390 に答える
0

この投稿を見てください

テキストの場合、空のラベルを使用して、検証の失敗時に「このテキストボックスに入力してください」というテキストボックスのすぐ下にテキストを表示できると思います。

于 2013-11-09T20:20:24.637 に答える