Question

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

所以这个代码......我在一个字段上应用字母数字验证，但即使我像其他字符一样给出无效输入，表单也会提交到哪里我做错了？我是这个网站的新手，所以任何帮助将不胜感激：）

Answer 1

这里有几个问题。首先，你永远不会返回结果，所以即使函数结果为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/

Answer 2

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

function validate(){
    return validate_course_name();
}

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

<form onsubmit="return validate()" ...

Answer 3

您需要使用getElementById

包装course_name_info

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

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

希望能解决它。

验证不适用于js

3 个答案: