1 
<html>
<head>
</head>
<body>
<form class="form-horizontal cmxform" id="validateForm" method="get" action="../../course_controller" autocomplete="off">


<input type="text" id="course_name" name="course_name" placeholder="Enter Course Name..." class="row-fluid" required onkeyup="javaScript:validate_course_name();">
<label id="course_name_info" style="color:rgba(255,255,255,0.6);font-size:13px">
</label>



<button type="submit" name="user_action" value="add" class="btn btn-primary" onClick="javaScript:validate();" >Save</button>
<button type="reset" class="btn btn-secondary">Cancel</button>



</form>
<script type="text/javascript">
/**** Specific JS for this page ****/

//Validation things




function validate_course_name(){

var TCode = document.getElementById('course_name').value;

if( /[^a-zA-Z1-9 _-]/.test( TCode ) ) {

course_name_info.innerHTML="Please Enter Only Alphanumeric or _,-,' ' ";
return false;
}
else
{
course_name_info.innerHTML=" ";
return true;
}


}
function validate(){


validate_course_name();

}
</script>
</body>
</html>

所以这是代码......我在一个字段上应用字母数字验证，但即使我像其他一些字符一样提供无效输入，表单也会被提交，我在哪里做错了？我对这个网络很陌生，所以任何帮助都将不胜感激:)

4

3 回答 3

2

这里有几个问题。首先，您永远不会返回结果，因此即使函数结果为 false，它也不会返回到表单，因此表单会继续进行。要解决此问题，您可以将 onsubmit 添加到表单标签，或者甚至更好地将 onsubmit 事件附加到表单。

onsubmit="return validate();"

其次，您只需要一个函数，这里不需要从另一个函数调用一个函数，并且会导致额外的难度，因为您需要将结果返回给包装函数，然后需要将该结果返回给表格。

//Validation things
function validate() {
    var TCode = document.getElementById('course_name').value;
    if (/[^a-zA-Z1-9 _-]/.test(TCode)) {
        course_name_info.innerHTML = "Please Enter Only Alphanumeric or _,-,' ' ";
        return false;
    } else {
        course_name_info.innerHTML = " ";
        return true;
    }
}

这是您示例的工作小提琴：http: //jsfiddle.net/duffmaster33/nCKhH/

于 2013-05-15T01:57:24.023 回答
1

您的 validate() 函数应返回验证结果。目前 validate_course_name 的结果被丢弃。换句话说，它应该看起来像这样

function validate(){
    return validate_course_name();
}

此外，您可能希望将验证移至

<form onsubmit="return validate()" ...
于 2013-05-15T01:54:44.840 回答
0

您需要使用 getElementById 包装 course_name_info

document.getElementById('course_name_info').innerHTML="Please Enter Only Alphanumeric or _,-,' ' ";

然后更改标签的样式，使字体在白色背景上不是白色。

希望修复它。

于 2013-05-15T02:22:39.480 回答