2

因此,我正在尝试验证表单,并且在验证失败时无法更改文本框。相反,表格会完成。我想要的是,如果验证失败,文本框边框变为红色,并且文本框下方的红色文本显示“填写我们的这个字段!”

这是我为测试目的而编写的内容,但它不起作用,我不确定如何在相关框之后添加 red=colored 文本:

<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 回答